Question

我正在努力了解某些事情为何起作用的原因。在下面的代码中，当我输入函数（i）然后（）.delay（i * 1000）时，它一次动画3个对象1。如何添加一个参数＆＃34; i＆＃34;从一个动画制作一次到一个？

       <div class="dotMarker">
           <div class="glowMarker"></div>
           <div class="glowDot"></div>
       </div>
       <div class="dotMarker">
           <div class="glowMarker"></div>
           <div class="glowDot"></div>
       </div>
       <div class="dotMarker">
           <div class="glowMarker"></div>
           <div class="glowDot"></div>
       </div>
<script>
$(document).ready(function(){
    $('.dotMarker').each(function(i){
        $(this).delay(i*1000).animate( {opacity: 1, top:'+=50px'}, '2000', function(){
            $(this).children('.glowDot').delay(100).animate( {opacity: 1, width: "+=25px"}, '2000');
        });
    });
});
</script>

Answer 1

传递给.each()的函数中的第一个参数给出一个从0开始的值，并为传递给.each()的每个元素计算。

因此，对于您将要调用的第一个元素

$(this).delay(0 * 1000)...  = $(this).delay(0)...

对于第二个元素

$(this).delay(1 * 1000)...  = $(this).delay(1000)...

第三次

$(this).delay(2 * 1000)...  = $(this).delay(2000)...

依此类推，将元素上的动画错开1秒。

试图弄清楚函数（i）是如何工作的

1 个答案: