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. NO IMAGE

    JavaScript

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

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

  2. Simple Sidebar
  3. jQuery Video Extend

    JavaScript

    動画をチャプターごとに区切れる「jQuery Video Extend」

    jQuery Video Extendは動画をチャプターごとに区切った…

  4. TwentyTwenty

    JavaScript

    2枚の画像を見比べれるjQueryプラグイン「TwentyTwenty」

    TwentyTwentyは2枚の画像を見比べれる便利なjQueryプラ…

  5. JavaScript

    レスポンシブに対応している軽量のjQueryスライダー「Unslider」

    とても軽量でレスポンシブにも対応しているjQueryスライダー「Uns…

  6. MenuSpy

    JavaScript

    セクションビュー対応のナビゲーションメニュー実装「MenuSpy」

    MenuSpyは、ナビゲーションメニューを作成するためのjsライブラリ…

最近の記事

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

アーカイブ

PAGE TOP