Chrome / Safari 图像加载器，首次打开

Question

构建了我自己的图像滑块，在 Firefox 中完美运行。然而，在 chrome / safari 中，第一次打开页面时图像往往不会加载。 （如果刷新一切都很好）

var count = $("#show-image img").size();
var img = $("#show-image img");
$(document).ready(function () {
for(i=0;i<count;i++){
    var width = img[i].width;
    var height = img[i].height;
    $(img[i]).css({"width": width, "height": height});
    console.log(img[i].width);
}
});

在 chrome 和 safari 中，页面第一次加载某些图像时，高度和宽度设置为 0px。我假设是因为图像尚未完全加载。

当页面实际上已完全加载时，如何运行代码？

Answer 1

作为一种快速简单的解决方案，请使用 .load() 代替。

更好的解决方案是使用这个 jQuery 插件：

$(document).ready(function() {
    $('#show-image').imagesLoaded(function() {
        /* your code here */
    });
});

优点是你只需要等待那些特定的要加载的图像，而不是像 .load() 那样加载所有内容。