1
私は私のホームページ上の広告スライドショーを持っています。それは2枚の画像で構成されています。javascriptのスライドショーはより速く成長します、なぜですか？
私はnew Image()を作り、それらに.srcを設定し、これらの2枚の画像をプリロードします。
私は次の画像（つまりはimg要素のsrc属性にする必要があります）（私はこれを行う、すぐに、スライドショーが2枚の以上の画像から構成されることになるので）
の名前を返す機能giveNextNameを持っていますメインコードは次のようになります。
BillBoard = {};
BillBoard.folder = "/pictures/cards/";
BillBoard.ext = "png";
BillBoard.$ = $("#billboard img");
BillBoard.pics = 2;
BillBoard.changeTime = 7000;
BillBoard.names = ["ad1","ad2"];
BillBoard.currentState = 0;
BillBoard.images = // array of preloaded Images
(function(){
var image, images = [];
for (var i=0; i<BillBoard.pics; i++) {
image = new Image();
image.src = BillBoard.folder+BillBoard.names[i]+'.'+BillBoard.ext;
images.push (image);
}
return images;
}());
BillBoard.giveNextName = function(){/* getting the next name */};
// BillBoard change action
BillBoard.change = function(){
BillBoard.$.fadeOut(function(){
$(this).attr('src', BillBoard.giveNextName());
$(this).fadeIn();
});
}
// Starting BillBoard
window.setInterval(BillBoard.change, BillBoard.changeTime);
したがって、アイデアは簡単です。 window.setIntervalで、私はBillBoard.changeをn秒ごとに呼び出します。しかし、私はなぜ知らない、看板になるまったく絵は存在しませんまで（フェードインを実行する時間がありません）、より速く、より速く
を変更する場合は、私の間違いはありますか？
UPD。 Yannラミンリンクありがとうございます。
私はwindow.setInterval経由BillBoard.change n秒ごとに呼び出すべきではありません。代わりに、私はのコールバックでBillBoard.changeの呼び出しを追加する必要があります。
私はこのコードの意味：
BillBoard.change = function(){
BillBoard.$.fadeOut(function(){
$(this).attr('src', BillBoard.giveNextName());
$(this).fadeIn();
window.setTimeout(BillBoard.change, BillBoard.changeTime);
});
}
// simply call the change function
// it will be calling itself every n seconds
BillBoard.start = (function(){
window.setTimeout(BillBoard.change, BillBoard.changeTime);
}());