bsc-sliderは、シンプルでスタイリッシュなスライダーを実装することができるjQueryプラグインです。実用的なオプションもいろいろ揃っているほか、多彩なアニメーションエフェクトが用意されています。
bsc-slider
bsc-sliderのダウンロードや具体的な使い方は、以下のページからチェックできます。ファイルをダウンロードすれば実際のデモ動作も見ることが可能です。
デモではフェードで切り替わる優雅なスライダーが設置されています。複雑な機能や装飾がなく、とてもスタイリッシュな印象です。
マークアップ、使い方ともにとてもシンプルなので、簡単に実装することができます。
主なオプションは、autoplay、navigation、duration、effect、effect_speed、easing、heightです。オプションから、自動再生のオン・オフやナビゲーションの有無、エフェクトの設定やエフェクトスピードの調節などを手軽にカスタマイズできるのが便利ですね。
ちなみに、デモのエフェクトはfadeに設定されています。オプションに設定する場合は各エフェクトに番号が割り振られていて、その番号を指定します。fadeの場合は1になります。以下は各エフェクトとその番号です。全部で17種類あります。
- 0：None
- 1：fade
- 2：Slide Over to Top
- 3：Slide Over to Right
- 4：Slide Over to Bottom
- 5：Slide Over to Left
- 6：Slide to Right
- 7：Slide to Left
- 8：Slide to Top
- 9：Slide to Bottom
- 10：Slide Remove to Right
- 11：Slide Remove to Left
- 12：Slide Remove to Top
- 13：Slide Remove to Bottom
- 14：Parallax to Right
- 15：Parallax to Left
- 16：Parallax to Top
- 17：Parallax to Bottom
シンプルながらも、このように豊富なエフェクトが用意されているのが魅力的ですね。スタイリッシュで手軽に実装できるスライダーを探している人は、ぜひ「bsc-slider」をチェックしてみてください。
