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

Cube-jQuery-Slider3Dキューブなスライダーを実装できる「Cube-jQuery-Slider」前のページ

リッチキャプションを備えたイメージビューア「CaptionBox」次のページno-image

関連記事

  1. Starfield

    JavaScript

    宇宙空間を移動するような背景アニメーションを実装できる「Starfield」

    Starfieldは宇宙空間を移動するような背景アニメーションを実装す…

  2. JavaScript

    画像にマウスオーバーするとズームして綺麗にエフェクトがかかるjQueryプラグイン「Swish」

    画像にマウスオーバーをするとズームして綺麗なオーバーレイのエフェクトが…

  3. luxy.js

    JavaScript

    優雅な慣性スクロールとパララックスエフェクトを実装できる「luxy.js」

    luxy.jsは優雅で美しい慣性スクロールとパララックスエフェクトを実…

  4. plainModal

    JavaScript

    カスタマイズ性が高いシンプルなモーダルウィンドウのjQueryプラグイン「plainModal」

    plainModalはシンプルでカスタマイズ性が高いモーダルウィンドウ…

  5. slider Menu

    JavaScript

    メニューリストをスライダーメニューにするjQueryプラグイン「slider Menu」

    slider Menuはメニューリストをスムーズにスライダーメニューに…

  6. jQuery Responsive Tabs

最近の記事

  1. タリーズ ハムチーズ&サラダサンド
  2. クリニカのY字タイプのフロス
  3. 日和山公園の桜
  4. 成城石井 フレンチロースト
  5. COMOLI カシミアシルクニットパーカ

アーカイブ

PAGE TOP