Smooth Scroll behavior polyfill

JavaScript

ページ内をスムーズにスクロールできる「Smooth Scroll behavior polyfill」

Smooth Scroll behavior polyfillは、ページ内をスムーズにスクロールさせる機能を実装することができます。Window インターフェイスの拡張機能として導入されているとのこと。スクロールする位置を細かく指定することも可能です。

Smooth Scroll behavior polyfill

デモ

デモページでは、いくつかのページ内リンクが設置されていて、各リンクのボタンをクリックするとそれに応じた位置まで自動でスクロールされます。

画面の一番下や一番上までスクロールできるのはもちろん、100pxだけ下(もしくは上)にスクロールするといったことも可能です。スクロールさせる位置を細かく指定できるので、カスタマイズしたい人にもうれしいですね。

使い方に関してもすごくシンプルでわかりやすく実装できます。

スクロール動作もサクサクとスムーズに移動するので、ストレスなく目的の位置まで辿り着けます。縦長のサイトで、ページ内リンクをたくさん貼っている場合には積極的に活用したくなる機能ですね。

サポートされているブラウザ(テスト済み)は、Safari 6+、iOS Safari 6+、Chrome(last version)、natively supported in Firefox、Internet Explorer 9+、Microsoft Edge、Opera Nextです。

というわけで、ページ内をスムーズなスクロールで移動させることができる「Smooth Scroll behavior polyfill」のご紹介でした。

Smooth Scroll behavior polyfill

jQuery Elastic GridGoogle画像検索っぽいイメージギャラリーを実装できる「jQuery Elastic Grid」前のページ

軽量なガントチャートを実装できるjQueryプラグイン「jQuery gantt」次のページjQuery gantt

関連記事

  1. iziModal

    JavaScript

    エレガント・レスポンシブ・フレキシブルでそのうえ軽量なモーダルウィンドウ「iziModal」

    iziModalはエレガント・レスポンシブ・フレキシブルなモーダルウィ…

  2. no-image

    JavaScript

    SVGによるドーナッツ状(円形)のチャートを実装できる「donutty」

    donuttyはSVGによるドーナッツ状(円形)のチャートを実装できる…

  3. Zoom Slider

    JavaScript

    ズーム機能を備えたシンプルなコンテンツスライダー「Zoom Slider」

    Zoom Sliderは奥行き感を演出したズーム機能を備えたシンプルな…

  4. jExcel

    JavaScript

    Excelと互換性のあるスプレッドシートを埋め込めるjQueryプラグイン「jExcel」

    jExcelは、ブラウザにExcelと互換性のあるスプレッドシートを埋…

  5. jquery.inputmask

    JavaScript

    テキスト入力のマスク(入力補助)を作成する「jquery.inputmask」

    jquery.inputmaskは、ウェブページでのテキスト入力のマス…

  6. JavaScript

    画像やHTML要素に簡単にドロップシャドウをつけられるjQueryプラグイン「pShadow」

    個人的にすごく便利で使う機会がありそなjQueryプラグインの紹介です…

最近の記事

  1. CAR-HLD12BK
  2. OWL-LPB6701LA
  3. cheero Power Mountain mini 30000mAh CHE-110

アーカイブ

PAGE TOP