no-image

JavaScript

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

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()などが用意されています。

関連記事

  1. Slight Submenu
  2. jQuery-Simple-MobileMenu
  3. Animated Intro With jQuery

    JavaScript

    プログレスバーつきのカッコいいイントロページを実装する「Animated Intro With jQ…

    シンプルなアニメーションがとてもカッコいいイントロページを実装する「A…

  4. jumboShare

    JavaScript

    SNSシェアボタンとジャンボサイズのカウンターを設置できる「jumboShare」

    jumboShareはSNSのシェアボタンとジャンボサイズのカウンター…

  5. jQuery fullsizable
  6. JavaScript

    クールでお洒落なナビゲーションを簡単に実装できるjQueryプラグイン「Kwicks for jQu…

    クールでお洒落なナビゲーションを簡単に実装することができるjQuery…

最近の記事

  1. リンツ リンドール
  2. ジェットストリームの三色ボールペン(+シャーペン付き)と黒の替芯
  3. ブラジルイパネマ

アーカイブ

PAGE TOP