no-image

JavaScript

シンプルなバナースライドショーを実装できる「jsslider」

jssliderはシンプルなバナースライドショーを実装できるjQueryプラグインです。バナーをスライドショーで次々に表示させたい場合に便利ですね。自動スライドにも対応し、オプションを用いることでスピード調節やエフェクトの設定も可能です。ナビゲーション付きなので操作性もシンプルで使いやすいです。

jsslider

デモ

デモではシンプルなバナースライダーが表示されていて、スライダー内の右下にはナビゲーションが設置されています。ナビゲーションから現在の位置をチェックできたり好きな位置へ移動することができるので、シンプルながらもとても実用性に優れています。

バナーは自動で次々にフェードでスライドしていくので、ユーザーの視線をグッと集めやすいですね。

オプションには、banItemClass、navItemClass、navWrapClass、navBgWrapClass、prevOneBtnClass、nextOneBtnClass、prevPageBtnClass、nextPageBtnClass、perpage、curClass、event、effect、speedといった項目が用意されています。ちなみに、エフェクト(effect)のデフォルト値はnoneになっていて、他にはfadeという値が用意されています。また、スピード(speed)のデフォルト値は5000になっています。

jsslider

関連記事

  1. AJAX Live Search
  2. no-image

    JavaScript

    マテリアルデザインによるjQueryタイムピッカー実装「MDTimePicker」

    MDTimePickerはマテリアルデザインをコンセプトにしたタイムピ…

  3. JavaScript

    ショータイムが始まる前のスポットライトのようなjQueryプラグイン「Spotlight」

    Spotlightはショータイムが始まる前のスポットライトのようなアニ…

  4. Materialize Tags

    JavaScript

    マテリアルデザインのタグ管理を実装できる「Materialize Tags」

    Materialize Tagsは、マテリアルデザインのタグ管理を実装…

  5. linkunderline

    JavaScript

    テキストリンクにアンダーラインのアニメーションを実装できる「linkunderline」

    linkunderlineは、テキストリンクにアンダーラインを引くアニ…

  6. hoverpulse

    JavaScript

    マウスオーバーで画像が拡大するシンプルなjQueryプラグイン「hoverpulse」

    マウスオーバーで画像が拡大するシンプルなjQueryプラグイン「hov…

最近の記事

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

アーカイブ

PAGE TOP