css - CSS-backgroundImage 预加载

Question

我有 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);

    });
});