jquery-carousel-sliderは、FacebookページにあるカルーセルスライダーのようなUIを実装できるjQueryプラグインです。カードのように均一に並べられているので、好きなコンテンツへ簡単にアクセスできます。たくさんあるアイテムは、左右の矢印ボタンから手軽にスライドして切り替えていくことが可能です。
JSONファイルからも追加できる
以下のページからjquery-carousel-sliderの実際のデモ動作をチェックできます。
デモ
デモページには読み込み時に表示されているアイテム数が異なるサンプルが3つ用意されています。カルーセルスライダーにマウスオーバーすると、左右に矢印ボタンが表示されるので、ここから前後のアイテム群へ切り替えることができます。
サクサクと動作するのでストレスなく操作性も抜群です。デザインもカードを綺麗に並べているような感じなので、均一性や統一感がありとても見やすくなっています。
また、各サンプルにはJSコードによるセッティング例も記述されているので、こちらも参考になるかと思います。
オプションには、subject、cardw、cardh、cardn、margin、JSONといった項目が用意されています。カードの幅（cardw）や高さ（cardh）もここから手軽に変更できます。
ちなみに表示させるカード数はcardnという項目から設定できます。例えば、デモページの一番上にあるカルーセルスライダーは、cardnの値が7になっているので、7つのカードが表示された状態になっています。
そのほか、JSONファイルから画像、タイトル、ディスクリプションを追加させることもできます。
Facebookライクなカルーセルスライダーを実装したい人は、ぜひ「jquery-carousel-slider」を活用されてみてはいかがですか？ jquery-carousel-sliderの詳細やダウンロードは、以下のページになります。
