JavaScript

レスポンシブでカスタマイズ性に優れたカルーセルを実装できるjQueryプラグイン「slick」

slickというjQueryプラグインを使えば、レスポンシブでカスタマイズ性に優れたカルーセルを実装することができます。左右の前後移動する矢印や下部ナビゲーションも兼ね備えているので、とても実用的なカルーセルですね。実際のデモを触ってみましたが、すごく使いやすかったです。

[ads_center]

slickの使い方

slickの使い方はとてもシンプルで、これといって特に難しい設定もなさそうです。

$('.single-item').slick();

slick

slick

こんな感じで1つずつスライドさせていったり、複数の要素を指定した数だけスライドさせたりとオプション設定をすることで様々なカスタマイズが可能となります。

レスポンシブなカルーセルを実装したい時に役立つプラグインですね。

関連記事

  1. Expanding Bar Navigation Concept
  2. jQuery Smart Placeholder
  3. jQuery Lighter

    JavaScript

    優雅なフェードで拡大縮小されるLightbox系ギャラリー・jQuery Lighter

    jQuery Lighterは美しいフェードで画像を拡大縮小させること…

  4. jQuery LED

    JavaScript

    LEDディスプレイのようなカウントダウン・タイマー・時計を実装できる「jQuery LED」

    jQuery LEDは、LEDディスプレイで表示されるようなカウントダ…

  5. gridscrolling.js
  6. ItemSlide.js

    JavaScript

    タッチやスワイプでスライドするカルーセルのjQueryプラグイン「ItemSlide.js」

    ItemSlide.jsはタッチ、スワイプ、スクロールなどでスライドす…

最近の記事

  1. スタバのドリップのホットのショート
  2. LE エルイー 6 PANEL CAP
  3. タリーズ ハウスブレンド
  4. BAG-TW1BKシリーズ

アーカイブ

PAGE TOP