jQuery的优化循环动画功能

问题描述：

我需要找到实现这一结果的一个更有效的方法：jQuery的优化循环动画功能

的setInterval()混合与.each()和随后.animate()使得这个脚本相当缓慢。有没有一种方法可以利用其他“较便宜”的流程/功能来实现这一结果？

答

而不是setinterval也许你可以为animate（）创建一个回调函数，重新动画“this”并将其自身称为回调？

[编辑] 我删除了一点不必要的代码：

DoPopulateSoundBoard(); 
function DoPopulateSoundBoard(){ 
    $('.sound-syn-column').each(function(){ 
     var dSoundSyn = ''; 
     for(i = 0; i <= 8; i++){ 
       dSoundSyn += "<div class='ui-corner-all sound-syn'></div>"; 
      } 
     $(this).append(dSoundSyn + "<div class='sound-syn-cover'></div>"); 
    }); 




     $('.sound-syn-cover').each(function(){ 
        test34($(this)); 
     }); 

} 

function test34(obj){ 
    obj.animate({height: Math.floor(Math.random()*56) }, 500, function(){ 
      test34($(obj)); 
    });  
}

不知道这是任何更快，但也可能是因为setInterval的速度很慢。

请，研究什么的里面'this'当它里面'$（。如果我没有弄错，'this'在'$（...）each（function（）{//）中的时候''this每个（function（）{console.log（this）}）'.. -1 –

这个}）'指的是每个目前正在处理的对象......这将解释为什么我的代码正常工作。你想说什么？你能向我解释我做错了什么吗？ – BumbleShrimp

@tereško我在each（）回调中运行了console.log（$（this）），它记录了正在动画的元素，这正是我们想要传递给函数的元素。你能解释我做错了什么，所以我可以更新答案吗？ – BumbleShrimp

答

您可以通过添加独立setInterval()功能分配到每个div只有一次分离setInterval()和.each()：

$('.sound-syn-cover').each(function(){ 
    var $this = $(this); 
    $this.data('intervalCallback', setInterval(function(){ 
     $this.animate({height: Math.floor(Math.random()*56) }, 500); 
    }, 300)); 
});

jsFiddle

jQuery的优化循环动画功能

相关推荐