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. Vimeo Carousel Gallery
  2. Viewer

    JavaScript

    画像の拡大や縮小、回転などができるイメージギャラリー「Viewer」

    Viewerは画像の拡大や縮小、回転、上下左右の切り替えといった機能を…

  3. Modaal

    JavaScript

    アクセシビリティに優れたモーダルウィンドウを実装できる「Modaal」

    ModaalはWCAG 2.0のレベルAAをサポートしているアクセシビ…

  4. pixelate.js
  5. Morphext

    JavaScript

    複数テキストをアニメーションで切り替えていくjQueryプラグイン「Morphext」

    MorphextというjQueryプラグインを使えば、複数テキストをア…

  6. no-image

    JavaScript

    画像の遅延読み込みを実装できる軽量ライブラリ「Lazyestload.js」

    Lazyestload.jsは画像の遅延読み込み機能を実装できる軽量の…

最近の記事

  1. TAP-F27-2KP
  2. M32ミニ
  3. CITTA TT5.0
  4. Kindle Oasis

アーカイブ

PAGE TOP