我有2个div用于幻灯片和大约10个幻灯片图像。我读了许多教程如何预加载这些图像,但我仍然无法让它工作:( 我是jQuery的新手,所以这段代码可能包含maaany自行车)) 希望你能帮我弄清楚什么是错的。
$(function () {
var mainDiv = $("#homeBanner");
var secondDiv = $("#homeBanner2");
var aImages = [];
var imgCount = 10;
var iRnd = 0;
$(document).ready(function () {
for (var i = 0; i <= imgCount; i++) {
aImages[i] = new Image();
aImages[i].src = "url-to-image" + (i) + ".jpeg";
}
setInterval(function () {
if (iRnd < imgCount) {
iRnd++;
} else {
iRnd = 0;
}
secondDiv.queue(function () {
mainDiv.css("background-image", 'url(' + aImages[iRnd].src + ')');
secondDiv.dequeue();
});
secondDiv.animate({
opacity: 0
}, 2000, "swing");
secondDiv.queue(function () {
secondDiv.css("background-image", 'url(' + aImages[iRnd].src + ')');
secondDiv.dequeue();
});
secondDiv.animate({
opacity: 1
}, 0);
}, 3000);
});
});