jquery-backToTop

JavaScript

カスタマイズ性に優れたトップへ戻るボタンを実装できる「jquery-backToTop」

jquery-backToTopはカスタマイズ性に優れた「トップへ戻るボタン」を実装できるjQueryプラグインです。ページを下へスクロールしていくとトップへ戻るためのボタンが表示され、このボタンをクリックするとページ上部まで自動スクロールで戻ります。縦長のページには最適な機能ですね。

jquery-backToTop

デモ

デモでは2つのセクションに分かれていますが、どちらも下へスクロールしていくと右下にトップへ戻るボタンが表示されます。ここをクリックすると、各セクション内の最上部までスクロールされて戻ります。自分でいちいちスクロールして上まで行く必要がないので、とても楽ですね。

ボタンの中に表示されている矢印がクルッと上下に回転するアニメーションもとても素敵です。

jquery-backToTopはカスタマイズ性に優れているので、オプションもいろいろ用意されています。主なオプションは、backgroundColor、bottom、color、container、divFloat、effect、enabled、height、icon、left、pxToTrigger、right、scrollAnimation、theme、width、zIndexです。

ちなみに先ほどのアニメーションは「effect」という項目でいろいろ指定できます。デフォルト値は「”spin”」です。ほかにも、none、fade、spin-inverse、zoomという値から選ぶことが可能です。

オプションだけでなく、テーマやAPIなどもあり多彩なカスタマイズができるので、気になる方はぜひチェックしてみてください。ライセンスはMITになります。

jquery-backToTop

Simple button radiosシンプルで高性能なラジオボタンを実装できる「Simple button radios」前のページ

親要素の下端まで要素を固定表示できる「Scroll With Page」次のページno-image

関連記事

  1. stickUp
  2. JavaScript

    フレキシブルなjQueryプラグインのアコーディオンパネル「Flexible Slide-to-to…

    いい感じのアコーディオンがあったので試してみたところ、とてもよさげだっ…

  3. CSS3 Menu Slider
  4. Scroll To Top Then Fixed Navigation Effect With jQuery and CSS
  5. JavaScript

    文章の段落にコメントできるjQueryプラグイン「SideComments.js」

    おもしろそうだったのでメモがてらご紹介。SideComments.js…

  6. jQlouds

    JavaScript

    ふわふわと流れるアニメーション付きの雲を実装できるjQueryプラグイン「jQlouds」

    jQloudsというjQueryプラグインを使えば、ふわふわした雲を実…

最近の記事

  1. フィールグッドシャワー
  2. RP-PB055
  3. ESD-EFシリーズ

アーカイブ

PAGE TOP