0

ホバー時に背景画像を変更する必要があります。ドキュメントの準備ができたら Javascript を介して画像をプリロードしています。Firefox では問題なく動作しますが、Chrome と Safari では読み込みに時間がかかります。Firefoxのようにスムーズにする方法はありますか？さらに、画像は Mbs 単位でサイズが重くなります。

これは、ホバー時に画像をプリロードして変更するために行ったことです

$( document ).ready(function() {
    // Set Default home page background
    if(defaultBGimage != "" && defaultBGimage != null && typeof(defaultBGimage) != "undefined"){
        $.backstretch(defaultBGimage, {centeredY: false});
    }
    // Pre-load images 
    function preloadImages(srcs) {
        if (!preloadImages.cache) {
            preloadImages.cache = [];
        }
        var img;
        for (var i = 0; i < srcs.length; i++) {
            img = new Image();
            img.src = srcs[i];
            preloadImages.cache.push(img);
        }
    }

    preloadImages(catBGimages); // Pass array of images to preload it 

    jQuery(".level1-cat").hover(function(){ // on hover change home page background image
        if(catBGimages[jQuery(this).data('id')] != null && catBGimages[jQuery(this).data('id')] != "null" && catBGimages[jQuery(this).data('id')] != "" && typeof(catBGimages[jQuery(this).data('id')]) != "undefined"){
            $.backstretch(catBGimages[jQuery(this).data('id')], {centeredY: false});
        }
    });
});

前もって感謝します。

4

1 に答える 1

0

以下は、プリロード画像をすばやく試すためのコードです。

function preload(arrayOfImages) {
    $(arrayOfImages).each(function(){
        $('<img/>')[0].src = this;
        // Alternatively you could use:
        // (new Image()).src = this;
    });
}

// Usage:

preload([
    'img/imageName.jpg',
    'img/anotherOne.jpg',
    'img/blahblahblah.jpg'
]);
于 2013-11-12T05:24:57.697 に答える