gridslide.js

JavaScript

いろんな方向に画像をスライドできるjQueryイメージスライダー「gridslide.js」

gridslide.jsはいろんな方向に画像をスライドさせることができるjQueryイメージスライダーです。左右にスライドするのはもちろん、ナビゲーションスタイルによって上下や斜め方向にもスライドさせることが可能です。

gridslide.js

以下はgridslide.jsのデモページになります。

gridslide.js

デモ

ナビゲーションスタイルはGrid NavigationとClassic Navigation With Buttonsの2つがあります。

Grid Navigationはサムネイル画像がスライダー下部に並んでいて、各サムネイルをクリックするとメインの場所でスライド表示します。

現在表示されているサムネイル画像を基点に、例えば真下にあるサムネイルをクリックすると下からスライドして、右下にあるサムネイルをクリックすると右下からスライドしてきます。

各サムネイル画像が表示されている方向に合わせてスライドするのでとてもおもしろい機能ですね。

また、Classic Navigation With Buttonsは上下左右のボタンナビゲーションになっており、四方のいずれかのボタンを押すことでその方向にスライドします。

使い方もシンプルなので使いやすそうなのがいいですね。

$('.slider').gridSlide({
    menu: 'grid',
    imgGrid: true,
    title: true,
    speed: 500
});

ナビゲーションスタイルの変更はmenuというオプションから設定することができます。menuにはgridかnavが指定可能です。

gridslide.js

Uglipop.js軽量でミニマルなモーダルボックスを実装できる「Uglipop.js」前のページ

Macでデスクトップ画面を簡単に切り替える(移動)ショートカットキー次のページMacでデスクトップを切り替えるショートカットキー

最近の記事

  1. クリスマスエスプレッソロースト
  2. シーザーチキン 石窯カンパーニュ
  3. スキャルプ&ヘア リファイニング トリートメント オイル R
  4. ポーレックスの手動ミル
  5. クリスマスブロンドロースト
PAGE TOP