隐藏图像，直到重新加载它们 [英] Hide images until they're loaded

问题描述

我得到了一个jQuery脚本，该脚本会在某个时间间隔将数据动态地附加到持有人".数据如下:

I got a jQuery script which is dinamically appending data to the "holder" at some timeinterval. The data looks like this:

<div class="item-box etc etc"> <img src="data.png"> </div>

并且我一次要加载50张图像，我的目标是在加载每张图像时将它们设置为fadeIn.

and I'm loading like 50 images at once, my goal is to make them fadeIn, when each image is loaded.

我尝试了以下操作:

parentDiv.on("load", "img", function() {
    $(this).parent().fadeIn(500);
});

提琴: http://jsfiddle.net/3ESUm/2/

，但是on方法似乎没有load或ready方法.我没办法了.

but seems that on method doesn't have load or ready methods. I ran out of ideas.

推荐答案

只需在添加图像时设置onload属性即可.

just set the onload property when you add the image.

var img = new Image();
img.src = "some url"
img.onload=function(){$(img).fadeIn(500);}
document.getElementByID('parent').appendChild(img);

请参见工作示例此处

这篇关于隐藏图像，直到重新加载它们的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！