jQuery Section Navi Plugin

JavaScript

セクション単位でアップダウンできる「jQuery Section Navi Plugin」

jQuery Section Navi Pluginは、コンテンツのセクション単位でアップダウンできるボタンを実装できるjQueryプラグインです。縦長ページなどで、区切りよくコンテンツを読み進めていきたい時なんかに便利ですね。

jQuery Section Navi Plugin

デモ

デモではセクションごとにコンテンツが縦に並べられていて、画面右下には「Down」と書かれたボタンが表示されています。ちなみに大きい画面でコンテンツが下まで見えている状態ではボタンが表示されないので、その場合は画面の横幅を縮小することでボタンが表示されるかと思います。

Downボタンをクリックすると、セクション単位でスクロールされます。下へスクロールされると「Down」の他に「Up」というボタンも表示されます。Down/Upボタンからセクション単位でサクサクと移動できるので、効率的に目的のコンテンツの始まりの位置へ移動できますね。

ちなみにスクロール移動されるスピードなどはオプションから調節できます。用意されているオプション項目は、buttonUp、buttonDown、offset、speed、hideButtons、speedHideBtn、ignoreFirst、useEmptyです。

というわけで、セクション単位でスクロール移動するアップダウンボタンを実装できるjQueryプラグイン「jQuery Section Navi Plugin」の紹介でした。

jQuery Section Navi Plugin

no-imageシンプル・軽量なjQueryイメージビューア「WimmViewer」前のページ

レスポンシブ対応の年ベースによるjQueryタイムライン「Timeliny」次のページTimeliny

関連記事

  1. Starfield

    JavaScript

    宇宙空間を移動するような背景アニメーションを実装できる「Starfield」

    Starfieldは宇宙空間を移動するような背景アニメーションを実装す…

  2. awNotices

    JavaScript

    スタート・ストップ機能がついたシンプルなjQueryニュースティッカー「awNotices」

    awNoticesはスタート・ストップ機能がついたシンプルに切り替わる…

  3. Alton

    JavaScript

    コンテンツごとに縦スクロールでナビゲートできるjQueryプラグイン「Alton」

    Altonはコンテンツごとに縦スクロールすることによりWebページをナ…

  4. PreViewTube.js
  5. Erge Drop Down Menu Control
  6. JavaScript

    スマホやタブレットでのスワイプに対応したモバイルにも最適なjQueryスライダー「Swiper」

    とてもよさそうだったのでメモしときます。スワイプで切り替えることができ…

最近の記事

  1. COMOLI ダブルレイヤー L/Sクルー
  2. メキシコ オアハカ
  3. ドリップ
  4. チェリー
  5. 温泉水99

アーカイブ

PAGE TOP