jQuery cardslider

JavaScript

カードをスライドさせるようにコンテンツを表示できる「jQuery cardslider」

jQuery cardsliderは、コンテンツをカードのように表示してスライドさせて見せることができるjQueryプラグインです。シンプル・軽量なのでサクサク動作するのが魅力です。コンテンツをただ表示させるだけではもの足りたいという人にはピッタリですね。

jQuery cardslider

デモ

デモでは、カードに書かれたようなコンテンツが複数設置されています。下部にナビゲーションがあるので、ここから各コンテンツにスライドさせることができます。

また、ナビゲーションをクリックしてスライドさせるだけではなく、キーボードの上下矢印キーからでも操作できるようになっています。カードを一枚一枚スライドさせるように、コンテンツを眺めていくことができるので、とてもおもしろいですね。

オプションもいろいろ用意されていて、keys、direction、nav、swipe、dots、beforeCardChange、afterCardChange、nextCard、prevCardなどといった項目を設定することが可能です。細かいカスタマイズをしたい人にとってもうれしい仕様といえそうですね。

というわけで、コンテンツをカードのようにスライドさせながら見せたいという人は、ぜひチェックされてみてはいかがでしょうか?

jQuery cardslider

関連記事

  1. evol-colorpicker

    JavaScript

    マイクロソフト オフィス2010のようなカラーピッカー「evol-colorpicker」

    evol-colorpickerは、マイクロソフト オフィス2010の…

  2. flipLightBox
  3. SweetAlert2

    JavaScript

    カスタマイズ性が高くアクセシビリティ(WAI ARIA)に優れたアラート実装「SweetAlert2…

    SweetAlert2は、レスポンシブ対応でカスタマイズ性が高くアクセ…

  4. gridslide.js

    JavaScript

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

    gridslide.jsはいろんな方向に画像をスライドさせることができ…

  5. Animate Plus

    JavaScript

    CSS、SVGを使った多彩なアニメーションを実装できる「Animate Plus」

    Animate PlusはCSS、SVGを使った多彩なアニメーションを…

  6. jquery.resizeend

    JavaScript

    ウィンドウをリサイズした時にイベント発生できる「jquery.resizeend」

    jquery.resizeendは、ブラウザのウィンドウをリサイズした…

最近の記事

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

アーカイブ

PAGE TOP