使用jQuery使图像在图像加载时淡入 [英] Making images fade in on image load using jquery

问题描述

我的页面上装满了图像，我希望每个图像在加载时都淡入.我有以下有效的代码，但似乎有问题，基本上有时并非所有图像都会淡入.

I have a page full of images and I want each of them to fade in when loaded. I have the following code which works but seems buggy, basically sometimes not all the image fade in.

有人对如何改进它有任何建议.

Does anyone have any suggestions of how to improve this.

谢谢

$('.contentwrap img').hide().load(function () {
    $(this).fadeIn(1000);
});

推荐答案

有时并非所有图像都淡入.

sometimes not all the image fade in.

是的，这通常是一个相当基本的问题:某些图像在为它们分配了加载事件处理程序之前就完成了加载.当图像被缓存时，这种情况尤其可能发生.

Yeah, this is typically a fairly basic problem: some images finish loading before you've assigned them a load event handler. This is especially likely when the images are cached.

不幸的是，如果图像是HTML格式，则唯一可靠的方法是包括一个(极其丑陋的)内联onload属性:

If the images are in the HTML the only reliable way is, unfortunately, to include an (extremely ugly) inline onload attribute:

<img src="..." alt="..." onload="$(this).fadeIn();">

这篇关于使用jQuery使图像在图像加载时淡入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！