JQuery SlideShow

JavaScript

軽量な自動スライドショー(画像・動画)を実装できる「JQuery SlideShow」

JQuery SlideShowは、画像・動画のスライドショーを実装できるシンプルなjQueryプラグインです。ファイル容量も軽量で、使い方もカンタンなところがグッドです。読み込み時は自動スライドショーになっています。

JQuery SlideShow

JQuery SlideShow

実際にファイルをダウンロードしてデモを見てみました。読み込み時は自動でスライドされる設定になっています。

一定の時間が経過すると、次のコンテンツへフェードで切り替わります。スライダーの右下には停止ボタンが設置されているので、ここをクリックすると、自動スライドが停止します。もう一度クリックすると、自動スライドが再びスタートします。

そのほか、前後移動できる左右矢印やナビゲーションも用意されています。

シンプルな構成で、サクサクとコンテンツをチェックできるので、ユーザーにとっては使いやすいスライダーといえますね。ただ、デモはレスポンシブに対応していないので、この点が少し残念なところです。

オプションには、slideDuration、transSpeed、loop、infobarなどがあります。デフォルトの設定値は、slideDurationが5000、transitionがnone、transSpeedが500、loopがtrue、infobarがfalseです。

スピードやループなど、ちょっとしたカスタマイズができるので、「たくさんの機能はいらないからシンプルな自動スライドショーを実装したい」という方にはオススメです。

高い機能性というよりも、軽量さや実装のしやすさなどを重視する場合に使われてみてはいかがでしょうか。

Photoshopで古びた羊皮紙に書かれた地図イメージの作り方前のページ

レスポンシブやタッチ対応などさまざまな機能を搭載したギャラリー実装「lightgallery.js」次のページlightgallery.js

関連記事

  1. JavaScript

    多層に重なり合う美しいグラデーションの背景を実装できるjQueryプラグイン「SHARDS」

    多層に重なり合う美しいグラデーションの背景を実装できるjQueryプラ…

  2. JavaScript

    巻き簾のようにメニューを開閉するアニメーションを実装できるjQueryプラグイン「Makisu」

    巻き簾のようにリスト化した要素を1つずつ開いていったり閉じていったりで…

  3. RV gallery-slider

    JavaScript

    軽量でタッチフレンドリーなギャラリースライダー「RV gallery-slider」

    RV gallery-sliderは軽量でタッチフレンドリーなギャラリ…

  4. Priority Nav Scroller

    JavaScript

    水平スクロールができるナビゲーション「Priority Nav Scroller」

    Priority Nav Scrollerは水平スクロールを備えたナビ…

  5. jQueryでウィンドウサイズによって処理を変える

    JavaScript

    jQueryでアニメーションを遅らせるにはdelayを使えばいいらしい

    ちょっとしたメモです。jQueryでanimateをメソッドチェーンで…

最近の記事

  1. King クリーニングティッシュ
  2. PDA-STN36S
  3. クッキー&クリーム ポップコーン
  4. マウイチップス マウイオニオン味
  5. グリーンビーントゥーバー

アーカイブ

PAGE TOP