Question

在我的页面上有一个动画GIF显示如下：

<div>
     <a id="image" style="background-image: url('http://example.com/12.gif);"></a>
</div>

当用户点击时，背景图片网址会从以下列表中切换为随机网址：

<span class="image_url">http://i.imgur.com/qefIaR.gif</span>  
<span class="image_url">http://tinypics.com/96683.gif</span>
<span class="image_url">http://imageshost.com/36683.gif</span>
<span class="image_url">http://example.com/wp-content/uploads/funny_carrot.gif</span>

现在问题是动画GIF的加载速度非常慢，所以我想我会加载它们：

    // PRELOAD IMAGES
    (function($) {
            window.onload = function () { 
            function preload(preload_img) {
                    $('<img/>')[0].src = preload_img;
                    alert(preload_img); // Debug
            }
            var preload_url;
            setTimeout(function(){
                $('.image_url').each(function(){
                    preload_url = $(this).text();
                    preload(preload_url);
                });
            }, 3000);
        }
    }(jQuery));
    // END PRELOAD

然而，GIF仍然加载缓慢，我没有注意到任何差异。我的代码有什么问题，或者我有办法确认它确实有效吗？

Answer 1

Google Chrome插件（Cache Killer）似乎导致了问题，而不是代码。

预加载动画GIF

1 个答案: