この記事は最終更新日から2年以上が経過しており、情報が古くなっている可能性があります。

jQueryを用いてクロスフェードするスライドショーを作ります。


非常に使いやすい定番プラグインjQuery crossFaderを使用させて頂きます。
まずはjQuery crossFaderをダウンロードして設置します。

<script src="jquery.min.js" type="text/javascript" charset="UTF-8"></script>
<script src="jquery.crossFader.js" type="text/javascript" charset="UTF-8"></script>

次にJavaScriptで設定を記述して行きます。

<script type="text/javascript" >
$(function(){
$('#fader span').crossFader({
timer: 3500,
speed: 1000,
changeSpd: 400
});
});
</script>