infiniteSlider2.js

JavaScript

シンプルな操作性でカスタマイズ性にも優れたスライダー実装「infiniteSlider2.js」

infiniteSlider2.jsは、シンプルな操作性で使いやすいスライダーを実装することができるjQueryプラグインです。前後移動できる左右矢印や、下部ナビゲーションを有するほか、豊富なオプションによりカスタマイズ性にも優れています。

infiniteSlider2.js

デモ

デモではスライダーにマウスオーバーすることで、前後移動できる左右の矢印と下部ナビゲーションが表示されます。下部ナビゲーションでは、各項目にマウスオーバーするとサムネイルっぽいアイテムが表示されます。

スライド移動する際に、どういったコンテンツの特色なのかを簡単にチェックできるのは便利ですね。

デモのスライダーはオートプレイになっているので、自動でスライド移動していきます。最後のコンテンツまでスライドされると、また始めのコンテンツに戻りそこからスライドしていきます。

また、infiniteSlider2.jsには豊富なオプションが用意されており、自分好みにカスタマイズして使いたい人にはピッタリです。

具体的には、width、height、arrows、toggles、labels、slideBackgroundColor、slideBackgroundImage、arrowWidth、arrowHeight、toggleShape、toggleWidth、toggleHeight、slideLabelWidth、slideLabelHeight、autoplay、slideInterval、slideDuration、cursorなどといったオプション項目のセッティングが可能です。他にもまだまだオプションがあるので、気になる方はぜひチェックしてみてください。

というわけで、シンプルな操作性で使いやすい上にカスタマイズ性にも優れているスライダーを実装できるjQueryプラグインを探している方は、ぜひ活用されてみてはいかがでしょうか?

infiniteSlider2.js

JQuery-SnakeGalleryホバーした方向へエフェクトが追従してくる「JQuery-SnakeGallery」前のページ

軽量、フラット、シンプルなツールチップを実装できるjQueryプラグイン「Tipr」次のページTipr

関連記事

  1. JavaScript

    フレキシブルなjQueryプラグインのアコーディオンパネル「Flexible Slide-to-to…

    いい感じのアコーディオンがあったので試してみたところ、とてもよさげだっ…

  2. Textillate.js

    JavaScript

    テキストに面白いCSS3アニメーションを加えることができるjQueryプラグイン「Textillat…

    指定したテキストに面白いCSS3アニメーションを加えることができるjQ…

  3. universal-tilt.js

    JavaScript

    パララックスなど多彩なチルト効果を実装できる「universal-tilt.js」

    universal-tilt.jsはパララックスやスケールなど多彩なチ…

  4. no-image

    JavaScript

    背景にSVGによるライン(線)をランダムで生成する「ckLine.js」

    ckLine.jsは背景にSVGによるライン(線)をランダムで生成する…

  5. no-image

    JavaScript

    シンプルでカスタマイズも簡単なパララックスエフェクト実装「parlx.js」

    parlx.jsはシンプルでカスタマイズも簡単なパララックスエフェクト…

  6. PWS Tabs jQuery Plugin

最近の記事

  1. ハムエッグホットサンドとドリップコーヒー
  2. 高輪ゲートウェイ駅のスタバ
  3. 新幹線
  4. リッチモンドホテル
  5. ハーブバターチキン 石窯フィローネとドリップコーヒー

アーカイブ

PAGE TOP