no-image

JavaScript

スタイリッシュなスライダーを実装できるjQueryプラグイン「bsc-slider」

bsc-sliderは、シンプルでスタイリッシュなスライダーを実装することができるjQueryプラグインです。実用的なオプションもいろいろ揃っているほか、多彩なアニメーションエフェクトが用意されています。

bsc-slider

bsc-slider

デモではフェードで切り替わる優雅なスライダーが設置されています。複雑な機能や装飾がなく、とてもスタイリッシュな印象です。

マークアップ、使い方ともにとてもシンプルなので、簡単に実装することができます。

主なオプションは、autoplay、navigation、duration、effect、effect_speed、easing、heightです。オプションから、自動再生のオン・オフやナビゲーションの有無、エフェクトの設定やエフェクトスピードの調節などを手軽にカスタマイズできるのが便利ですね。

  • 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」をチェックしてみてください。

star-rating-svgカスタマイズ性に優れたレーティング(星評価)実装「star-rating-svg」前のページ

チェックボックスをアニメーショントグルにする「jquery-simpletoggler」次のページno-image

関連記事

  1. FocusPoint

    JavaScript

    画像の指定した部分を中心にレスポンシブ化できるjQueryプラグイン「FocusPoint」

    FocusPointというjQueryプラグインを使えば、画像の指定し…

  2. NO IMAGE

    JavaScript

    レスポンシブ対応のスタイリッシュなスライドショー実装「offbeatSlider」

    offbeatSliderはレスポンシブに対応したアニメーション付きの…

  3. jquery.inputmask

    JavaScript

    テキスト入力のマスク(入力補助)を作成する「jquery.inputmask」

    jquery.inputmaskは、ウェブページでのテキスト入力のマス…

  4. Mobilepopup

    JavaScript

    軽量でモバイルにも最適なポップアップウィンドウを実装できる「Mobilepopup」

    Mobilepopupは、軽量でカスタマイズ性に優れたモバイルにも最適…

  5. LoadGo

    JavaScript

    画像をプログレスバー(ローディング)にできるjQueryプラグイン「LoadGo」

    LoadGoはサイト内にあるロゴなどといった画像をプログレスバー(ロー…

  6. Fancy Input

    JavaScript

    かっこいいエフェクトのテキスト入力を実装できる「Fancy Input」

    Fancy Inputは、かっこいいエフェクトを備えたテキスト入力を実…

最近の記事

  1. 東京都現代美術館
  2. スーリア バターチキン
  3. そそそ 明太クリームそうめん
  4. すしざんまい
  5. 蒼龍唐玉堂 特製牛バラ担々麺

アーカイブ

PAGE TOP