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. no-image

    JavaScript

    スマホなどに最適なテーブルを実装できる「Mobile-Friendly Table」

    Mobile-Friendly Tableはスマホなどのモバイルに最適…

  2. CollagePlus

    JavaScript

    画像を綺麗に整列させるjQueryプラグイン「CollagePlus」

    画像を綺麗に整列させる便利なjQueryプラグイン「CollagePl…

  3. Parazoom

    JavaScript

    クールに拡大・チルトする画像ズーム「Parazoom」

    Parazoomはクールに拡大・チルトする画像ズーム機能を実装できるj…

  4. JavaScript

    2KB程の軽量&シンプルなjQueryスライダー「Craftyslide」を使ってみた

    とてもシンプルで軽量ないい感じのjQueryプラグイン「Craftys…

  5. jQueryでウィンドウサイズによって処理を変える

    JavaScript

    jQueryのマウス操作のイベントをまとめてみる

    マウス操作に関するイベントをまとめてみました。まとめたイベントはmou…

  6. Tikslus Carousel

最近の記事

  1. クッキー&クリーム ポップコーン
  2. マウイチップス マウイオニオン味
  3. グリーンビーントゥーバー
  4. VS-543AS

アーカイブ

PAGE TOP