Jquery 是否在成功加载每个映像时回调单个映像？

如何检测图像是否预先加载，然后执行回调动画以在图像中淡入

我有10张图片散布在我的网站上，我简化了下面的html，例如：

<header>
    <img src="headerImage.jpg" />
</header>
<div class="content">
    <img src="contentImage.jpg" />
</div>
<footer>
    <img src="mylogo.jpg" />
    copyright 2014 mywebsite.com
</footer>

现在我面临的问题是，无论是否一次性加载，所有图像都将淡入。是否有一种方法可以在加载后检测单个图像，然后仅淡入/触发动画回调？

您可以使用

加载事件在元素和所有子元素完全加载后发送给元素

代码

一旦加载了映像，就会调用处理程序

---

谢谢你的解决方案，我试过了，效果很好，但发现了另一个问题。不知何故，某些图像不会加载并保持不透明度=0。我注意到那些未加载的图像是从另一台服务器托管的。。。。。

<style>
    img{opacity:0;}
</style>

$("img").animate({'opacity':1 },600);

$('img').load(function(){
    $(this).animate({'opacity':1 },600);
});