no-image

JavaScript

スクロールした時に最適な位置に合わせてくれる「jQuery.panelSnap」

jQuery.panelSnapは、コンテンツごとに縦に並べられたパネルのページをスクロールした時に、自動で最適な位置に合わせてくれるjQueryプラグインです。スクロールしてコンテンツの位置がズレてた場合、自動的に位置を修正してくれるのでとても便利ですね。

jQuery.panelSnap

デモ

デモではコンテンツがパネルごとに縦に並んでいます。例えば、下へスクロールしていった時にパネルとパネルの間の中途半端な位置に止まってしまった場合、自動的に最適な位置まで移動してくれます。

パネルごとにコンテンツを分けて縦に並べたWebページを作りたい時には、とても役立つ機能になるのではないでしょうか。

デモページには、メニュー、キーボード、NEXT・PREVボタン、コールバック、イベント、オフセットと、いろんなパターンのサンプルが用意されています。

また、jQuery.panelSnapにはオプションもいろいろあり、menuSelector、panelSelector、namespace、directionThreshold、slideSpeed、delay、easing、offset、navigationなどカスタマイズして使用したい場合にもピッタリです。

マークアップもシンプルで使いやすそうなので、気になる人はぜひチェックしてみてください。

jQuery.panelSnap

関連記事

  1. Before and after slider
  2. Switchery

    JavaScript

    チェックボックスをiOS7のようなスタイルにしてくれるjQueryプラグイン「Switchery」

    SwitcheryというjQueryプラグインを使えば、チェックボック…

  3. Responsive jQuery Pop Up Gallery
  4. StickyStack.js

    JavaScript

    パネルにスタッキング効果を実装できるjQueryプラグイン「StickyStack.js」

    StickyStack.jsはパネルにスタッキング効果を実装することが…

  5. Tikslus Carousel
  6. jquery-calendar

    JavaScript

    レスポンシブ対応でスケジュール管理もできるカレンダー「jquery-calendar」

    jquery-calendarはレスポンシブに対応したスケジュール管理…

最近の記事

  1. ネクスタイム
  2. フォールドオーバーポーチ
  3. 田沢湖
  4. ハクバ シリコンクロス
  5. トライポッドスリーブ

Instagram始めました

Facebookページ

PAGE TOP