-5

这是我的代码。它在 Chrome 和 Firefox 上运行良好,但在 Internet Explorer 上不行,而且在 Mobile Safari 上也行不通。

$(document).ready(function () {
    $('.correct4').load(function () {
        $("#gallery .loader4").css("display", "none");
        $("#gallery .correct4").css("display", "block");
    });
});
4

2 回答 2

1

我发现即使/当隐藏图像尚未加载时,IE 也会触发 jQuery.load() 事件。就像它在决定触发事件时完全忽略隐藏的图像一样。.load()

为了解决这个问题,我只是将我的图像放在一个隐藏的容器中div,而不是隐藏图像本身。然后,一旦包含的资产完全加载,该.load()事件将触发并显示其中已包含图像的容器。

HTML:

<div id="containerDiv">
    <img src="/image.jpg" alt="" border="0" />
    <img src="/picture.jpg" alt="" border="0" />
</div>

CSS:

#containerDiv {
    display: none;
}

jQuery:

$('img').load(function() {
    $('#containerDiv').css({'display': 'block'});
});
于 2012-09-25T20:17:56.647 回答
-1

我会远离 jQuery 加载事件...此时您真的不想将任何内容加载到 DOM 中。你只想参考你想在缓存中拥有的所有图像。我通常是这样处理的。在文档准备好时创建一个空数组,为每个图像添加一个新的 Image 对象到数组中,然后将“src”属性分配给图像,然后您在数组中创建的每个图像都将在您的缓存中。这将适用于所有浏览器......它已经过测试。

$(document).ready(function () {

imagesSearchPage = new Array();

imagesSearchPage ["imageTitle01"] = new Image();
imagesSearchPage ["imageTitle01"].src = "images/imageTitle01.png";
imagesSearchPage ["imageTitle02"] = new Image();
imagesSearchPage ["imageTitle02"].src = "images/imageTitle02.png";
imagesSearchPage ["imageTitle03"] = new Image();
imagesSearchPage ["imageTitle03"].src = "images/imageTitle03.png";
});

我通常为每个页面创建一个新数组,只是为了让事情井井有条。我知道这可能看起来像很多代码,但是您的所有图像都会被缓存,如果需要,您还可以从数组中引用图像。

清除缓存,打开开发工具,单击网络 > 图像,您将看到图像。

希望这可以帮助!

于 2012-09-25T20:37:53.500 回答