如何创建一个接一个图像的淡入加载效果

Question

我的灵感来自于this页面上的拇指加载效果，但老老实实地根本不知道如何在每个拇指上创建这样的效果。

谁能指出我正确的方向，甚至给我一些代码？

我已经看到了其他一些相关的主题，但是那些将会在一个接一个地加载许多图像的情况下无效。

谢谢！

Answer 1

剧本：

$(function(){
    $("#listing .img").each(function(index) {
        $(this).hide().delay(100*index).fadeIn(300);
    });
});

然后是html：

<div id="listing">
  <div class="img"><img src="http://www.marclagrange.com/files/thumbs/medium/snow-white20091.jpg" alt=""  width="235" height="180" /></div>
  <div class="img"><img src="http://www.marclagrange.com/files/thumbs/medium/soeur-sourire70x50.jpg" alt=""  width="235" height="180" /></div>
</div>

不要忘记包含jquery。

这是jsFiddle。