[JS]jqueryを使ったクロスフェードするスライドショー

案件でスライドショーが必要になったので、Flashでサクっと作ろうと思ったら「スマホでも見たいからJSで!」という、最近良く聞くセリフを言われました。

基本的にJSの知識はほぼゼロなので、便利なプラグインを使おうと思ってググッたのですが、左右にスライドするスライドショーのプラグインばっかりで、フェードイン・フェードアウトするやつはあってもIEに対応してなかったりして、良いのがなかったのでつくりました。

設定項目

var fadeTime = 700; //フェードイン・フェードアウトの時間(ミリ秒)
var delayTime = 5000; //次の画像に切り替わるまでの時間(ミリ秒)
var autoFlg = true; //自動で次の画像に切り替わるかどうかの設定
var naviFlg = true; //ナビゲーションの表示・非表示の設定

サンプルのダウンロード

Javascriptの勉強におすすめです!!

コメント

  1. Pingback: Amazonへのオススメリンクをフェードインしながら紹介しつつ、PVアップも狙えるかもしれないウィジェットをサイドバーに作ってみた | OZPAの表4

  2. Taka on 09/13/2012 at 1:23 AM said:

    はじめまして.
    シンプルなスライドショーのライブラリを探していたところ,こちらに辿り着きました.

    こちらのライセンスは何になりますでしょうか.
    商用利用させていただけたらと思っております.

    よろしくお願いいたします.

  3. MELLOWDOWN on 09/13/2012 at 2:59 PM said:

    Taka様

    当BLOGに掲載しているソースコードはご自由にお使いいただいて問題ありません。
    ただ、jsファイル内のクレジットを残しておいていただければと思います。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Post Navigation