2015年とくに重宝したカルーセル・ライブラリ

レスポンシブ対応なWEBのお仕事が多くなりましたが、そんな中ホームページに設置するキービジュアル表現に四苦八苦するシーンも少なくないのではないでしょうか。仕事内容に合わせて都度都度カルーセル・ライブラリをネットで探してはあーでもないこーでもない、こんなことを繰り返している方もいるかと思います。ということで僕が今年のお仕事を通じて利用してきたものの中から自身が厳選した”導入が比較的簡単で業務レベルで今後も重宝しそう”なカルーセル・ライブラリをいくつか紹介したいと思います。

bxslider

超定番のレスポンシブ対応カルーセル。見た目はシンプルな画像スライドですがオプションも豊富なのでホームページのキービジュアルでアクセントを付けたいなどの要望に導入しやすいライブラリだと思います。初期のCSSスタイルが若干イケてなく不要な定義を直すのが面倒なくらいでしょうか。
bxslider スクリーンショット

slick

こちらも比較的定番のライブラリかもしれません。指定のコンテンツエリアに対してN個のボックスエリアを表現できるのが特徴的で数の多い商品やギャラリーなどをスライダー方式で見せたい要望に導入しやすいライブラリだと思います。オプションを使って動きに変化を出したり、レスポンシブのブレイクポイントごとにオプションを設置できるのも魅力的だと思います。
slick スクリーンショット

Jssor

今年掘り出してきた面白いカルーセルの一つ。一番の特徴は一枚一枚の画像上にさまざまな要素をアニメーションを付けて表現できる点です。一昔前に流行ったFLASHアニメーションのような表現をHTML内に属性指定していくことでダイナミックなキービジュアルを再現できると思います。こちらもレスポンシブに対応しているので各種端末でダイナミックに見せることができるのが魅力的です。
Jssor スクリーンショット

FlimRoll

こちらも今年掘り出したカルーセルの一つで今後重宝しそうな予感。画像スライダーの多くはコンテンツエリア内に収まるような仕様が多いですがこのライブラリは左右に見切れるような画像スライダーを表現できます。またフルスクリーンで見せられるオプションもあるので写真を大きく見せたいときなどにも使えそうです。先に紹介したbxsliderとslickをバランスよく落とし込んだライブラリだと思います。
flimroll スクリーンショット

以上になります。安上がりですがちょっと早いクリスマス・プレゼントな記事を同業者のみなさまへ。誰かの役に立てばと願い。。。メリークリスマス!!!

  • 2015.12.14
  • お仕事っぽいこと