使用jQuery对纹波淡入淡出效果进行编程的最佳方法

我是jQuery的新手，我正在练习淡入淡入，从一个图像开始，然后继续到下一个图像，依此类推。我已经写了一段代码（如下），但想知道是否有更简单或更优雅的编写方法？我尝试了 each（）函数，但似乎不起作用：

    <script type="text/javascript" src="jquery/jquery-1.8.2 .min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    //alert($("div img").length);
    $("div img").css("display","none");
    var delayAmt=0;
    for(var x=0;x<$("div img").length;x++){
        $("div img:eq("+x+")").delay(delayAmt).fadeIn(1000);
        delayAmt+=250;
    }
});
</script>
</head>
<body>
<h1>Ripple fade in.</h1>
<div>
<img src="images/hot.jpg" id="target0">
<img src="images/hot.jpg" id="target1">
</div>
</body>
</html>

HTML：

<body>
<h1>Ripple fade in.</h1>
<div id="images">
<img src="images/hot.jpg" id="target0">
<img src="images/hot.jpg" id="target1">
</div>
</body>
</html>

j查询：

$(document).ready(function(){
   var delay=0;
   $('#images').children('img').each(function () {
      $(this).css("display","none");
      $(this).delay(delay).fadeIn(1800);
      delay += 1000;
   }); 
});

jsFiddle链接在这里： http://jsfiddle.net/salih0vicX/6GZt6/

相关内容

最新更新

热门标签：