Scrollgress

JavaScript

スクロールに連動するプログレスバーを実装できる「Scrollgress」

Scrollgressはスクロールに連動するシンプルで軽量なプログレスバーを実装できるjQueryプラグインです。画面上部に表示されるプログレスバーにより、今どのくらいの位置にいるのか把握しやすいので、縦長のページなどに役立ちますね。

Scrollgress

デモ

下へスクロールしていくと画面上部に表示される赤いプログレスバーが横に伸びていきます。

使い方も非常に簡単です。jQueryとプラグインファイルを読み込んだ状態で、以下のようにセッティングするだけです。

$('body').scrollgress();

また、オプションではプログレスバーの高さやカラーなどを設定することもできます。

Scrollgress

関連記事

  1. Page Stack Navigation

    JavaScript

    ページをスタッキングできる「Page Stack Navigation」

    Page Stack Navigationはページをスタッキングできる…

  2. percircle

    JavaScript

    カスタマイズもできるパーセンテージのサークル実装「percircle」

    percircleはCSSによるパーセンテージのサークルを実装できるj…

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

    JavaScript

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

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

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

    JavaScript

    jQueryのfocusとblurを使えばフォームが便利になる

    jQueryのfocusとblurを使えばフォームを便利にすることがで…

  5. JavaScript

    軽量(5KB)で機能も色々あるjQueryのスライダー「MobilySlider」を使ってみる

    軽量なんですが、色々と機能もあるいい感じのjQueryプラグイン「Mo…

最近の記事

  1. M32ミニ
  2. CITTA TT5.0
  3. Kindle Oasis
  4. OWL-WDDESK01

アーカイブ

PAGE TOP