Chrome / Safari图片加载器，第一次打开 [英] Chrome / Safari image loader, first time opening

问题描述

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

Built my own image slider, works perfectly inside firefox. Yet in chrome / safari the images tend to not load the first time the page is opened. (if you refresh everything is fine)

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。

In chrome and safari, the first time the page loads some of the images are getting the height and width set to 0px. I'm assuming cause the images aren't fully loaded yet.

当页面执行完全载入时，如何运行代码？

How is it possible to run the code, when page is ACTUALLY fully loaded?

推荐答案

作为一个快速简单的解决方案，使用 .load（） 。

As a quick and simple solution, use .load() instead.

更好的解决方案是使用< a href =https://github.com/desandro/imagesloaded =nofollow>此jQuery插件：

A better solution would be to use this jQuery plugin:

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

优点是您只需要等待加载这些特定图片， >

The advantage being that you only have to wait for those specific images to be loaded, instead of everything as you would for .load().

这篇关于Chrome / Safari图片加载器，第一次打开的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！