Jquery progress indicator on page scroll

JavaScript

スクロールしている進捗度をプログレスバーで教えてくれる「Jquery progress indicator on page scroll」

Jquery progress indicator on page scrollはスクロールしている進捗度をプログレスバーで教えてくれるjQueryプラグインです。スクロールしていくと、それに合わせてメーターが変化していきます。

Jquery progress indicator on page scroll

デモ

下へスクロールしていくとそれに合わせてメーターが右へ伸びていきます。逆に上にスクロールしていくとメーターが左へいきます。

スクロール中の位置情報がすぐに分かるので、長文記事などで自分が今どの辺にいるのかをプログレスバーで表示させたい時に役立ちますね。

使い方もとてもシンプルです。

$("#progress-bar").onscroll();

オプションを用いることで背景カラーや高さを設定したりすることができます。

Jquery progress indicator on page scroll

関連記事

  1. infoBox

    JavaScript

    マウスオーバーでインフォメーションボックスを表示させる「infoBox」

    infoBoxはアイコンにマウスオーバーするとインフォメーションボック…

  2. jQuery Tabs with Content Overlays
  3. multi-list

    JavaScript

    複数の選択可能なリストにするためのjQueryプラグイン「multi-list」

    multi-listは、順序付けされていないリストを複数の選択可能なリ…

  4. no-image

    JavaScript

    スライドアニメーションによる多階層なハンバーガーメニュー「ggContentMenu」

    ggContentMenuはスライドアニメーションを備えた多階層に最適…

  5. jquery-base-slider
  6. Emergence.js

    JavaScript

    ブラウザで要素の可視性を検出する「Emergence.js」

    Emergence.jsは、ブラウザで要素の可視性を検出することができ…

最近の記事

  1. mill オイルヒーター
  2. Anker PowerWave 10 Pad & Stand セット

アーカイブ

PAGE TOP