jquery - jQueryコードは特定のユーザーの不透明度に対して遅れます

Question

jQueryコードに少し問題があります。複数のプリロードされた画像の背景があります。一定時間内に背景を切り替えてほしい。例：

画像1は背景としてフェードイン15秒後に黒にフェードアウト画像2は背景としてフェードイン15秒後に黒にフェードアウトなど

しかし、問題はChromeで、いくつかの非常に短いラグがあり、私の訪問者はそれを本当に好きではないということです。（たとえば、テキストエリアボックスに書き込んでいる場合、黒にフェードアウトしている間、0.5秒間フリーズします）。

コードは次のとおりです。

var bgs = shuffle(["image1.png","image2.png","image3.png"]);
var actualBG = -1;
var endBG = bgs[bgs.length-1]; // "image3.png"

function changeBackground()
{
    if(actualBG == -1) // If it's the first time we fade in a background
    {
        $(".bg")
            .css({'background-image': 'url('+bgs[0]+'")'})
            .animate({opacity: 1}, 2000);
        setTimeout(changeBackground, 8000);
        actualBG++;
    } else {
        if(actualBG == endBG) // If we reached the end of the array
            actualBG = 0; // Go back to first slot
        else
            actualBG++; // Otherwise load the next background image

        $(".bg").animate({opacity: 0}, 'slow', function() {
            $(this)
                .css({'background-image': 'url('+bgs[actualBG]+')'})
                .animate({opacity: 1});
        });
        setTimeout(changeBackground, 15000);
    }
}

注：この問題はFirefoxでは発生しませんが、Chromeでは発生します。

あなたの答えをありがとう！