无限次重复功能

Question

基于之前的一些问题，我尝试无限次运行我的函数。 但它仍然不起作用。 如果我运行脚本，它会在奇怪的时刻被破坏，然后再次运行脚本，间隔很长。 任何人都可以帮助我让这个脚本运行没有间隔和停止吗？ 谢谢。

<script type="text/javascript">
$("#go").hide().ready(function(){
animatie();
});
var d = 0;
function animatie() {
 for(var i = 0; i < 3; ++i){
  var b = ".block"+i;
  $(b).hide().delay(d).fadeIn(2000);
  $(b).hide().delay(1000).fadeOut(2000);
  d += 4000;
 }
}
window.setInterval(animatie, 13000);
</script>

Answer 1

您可能希望在每次setInterval 触发时将d 重置为0。此外，也许4000 应该是5000 而不是（2000 + 1000 + 2000）。最后，您不需要.hide() 两次：http://jsfiddle.net/nZHCB/。

function animatie() {
 var d = 0;
 for(var i = 0; i < 3; ++i){
  var b = ".block"+i;
  $(b).hide().delay(d).fadeIn(2000).delay(1000).fadeOut(2000);
  d += 5000;
 }
}
animatie();
window.setInterval(animatie, 15000);

也就是说，您也可以使用一个函数来迭代一个元素。当最后一个动画 (.fadeOut) 完成后，使用下一个元素再次调用该函数：http://jsfiddle.net/nZHCB/2/。

$("div").hide();

(function animatie(i) {
    var b = ".block" + i;
    $(b).fadeIn(2000).delay(1000).fadeOut(2000, function() {
        animatie((i + 1) % 3);
    });
})(0);