要素ごとにスクロールできるjQueryプラグイン「snapScroll.js」

no-image

snapScroll.jsは要素ごとにきりのいいところでスクロールされる軽量なjQueryプラグインです。ランディングページなどの縦長ページなどで重宝しそうな機能ですね。スナップ撮影するような感じで、コンパクトなコンテンツをサクサクとスクロールで見ていくことができます。

snapScroll.js

デモ

上下にスクロールすると、各要素ごとにきりのいい場所でスクロールがストップします。区切りよくコンテンツをチェックしていけるので、1ページにコンテンツをしっかり分割したい場合に最適です。

実装も簡単でマークアップもわかりやすいと思います。また、オプションにはarrowKeys、duration、easing、ordered、scrollBarなどといった項目が用意されています。デフォルト値はarrowKeysがfalse、durationが600、easingが'swing'、orderedがtrue、scrollBarがtrueです。ちなみにeasingはswingの他にlinearという値も設定可能です。

その他、コールバックにはonLeave(currentPoing, nextPoint)やonArrive(prevPoint, currentPoint)が、メソッドにはscrollPrev()、scrollNext()、scrollToPoint(targetPoint, newOptions)、crrentPoint()、enable()、disable()などが用意されています。

スポンサーリンク

スポンサーリンク

アクセスランキング

Tags

Archives