JSで簡単にクロスフェードを実装できるCrossfader.js
今回のエントリーも前に仕事で使ったので、メモ書き程度にエントリー。
案件によっては、バナーの掲載エリアに制限があり、ローテーションさせる必要がある場合があります。
そんな時に便利なのがCrossfader.js。
» Javascript / CSS Crossfader : CSS . XHTML . Javascript . DOM : Brand Spanking New
独立系のjsなので特に別のライブラリは不必要で、記述するスクリプトも、非常にシンプルです。
» サンプル
実装方法は作者のサイトからダウンロードしたファイルに入っているbsn.Crossfader.jsを読み込んで、ファンクションCrossfaderを実行するだけ。
第一引数に表示する順番、第二引数に切り替える時間(ミリ秒)、第三引数に表示時間(ミリ秒)を与えればOK。
注意事項としてはJSオフの場合に当然、要素がすべてXHTMLの記述通りに表示されてしまうため、親要素に高さを与えてoverflow:hiddenにしておくくらい。
コメント＆トラックバック