循環jquery動畫

我有這段代碼，它運行一次然後停止。我希望它每十秒運行一次，我知道setinterval會循環代碼，但由於某種原因，它不工作？循環jquery動畫

<script> 
    $(document).ready(setInterval(function(){ 
     $("#club_color1 a").animate({color: '#000000'}, 1000); 
     $("#club_color2 a").animate({color: '#000000'}, 1000); 
     $("#club_color1 a").animate({color: '#FFFFFF'}, 1000); 
     $("#club_color2 a").animate({color: '#FFFFFF'}, 1000); 
    }),10000); 
</script>

來源

2013-07-18 user1155594

您可以使用普通的JQuery的動畫沒有顏色。你應該使用額外的插件，如http://www.bitstorm.org/jquery/color-animation/ – RMK

我和上面的代碼工作，但它只運行一次。 – user1155594

好的;只是要確定。請參閱下面的答案。 – RMK

我認爲最後一行必須

},10000));

來源

2013-07-18 14:02:25 James

使用回撥功能。以便它一個接一個地執行。

$(document).ready(setInterval(function(){ 
    $("#club_color1 a").animate({color: '#000000'}, 1000,function() { 
     $("#club_color2 a").animate({color: '#000000'}, 1000,function() { 
       $("#club_color1 a").animate({color: '#FFFFFF'}, 1000,function() { 
        $("#club_color2 a").animate({color: '#FFFFFF'}, 1000); 
       }); 
     }); 
    }); 
},1000);

來源

2013-07-18 14:01:40

好吧，這是真的有幫助，舉一些例子 – jycr753

我注意到一兩件事：

你忘了$.ready()的匿名功能，從而做到這一點：

<script> 
    $(document).ready(function() 
     setInterval(function(){ 
      $("#club_color1 a").animate({color: '#000000'}, 1000); 
      $("#club_color2 a").animate({color: '#000000'}, 1000); 
      $("#club_color1 a").animate({color: '#FFFFFF'}, 1000); 
      $("#club_color2 a").animate({color: '#FFFFFF'}, 1000); 
     },10000); 
    }); 
</script>

您可以使其遞歸：

$(document.ready(function() { 
    animate(); 
}); 

function animate() { 
    $("#club_color1 a").animate({color: '#000000'}, 1000, animate); 
    $("#club_color2 a").animate({color: '#000000'}, 1000, animate); 
    $("#club_color1 a").animate({color: '#FFFFFF'}, 1000, animate); 
    $("#club_color2 a").animate({color: '#FFFFFF'}, 1000, animate); 
}

在功能只需添加這些動畫然後添加函數的名稱作爲每個$.animate()的最後一個參數，然後調用一次animate()功能時，該文檔的準備。

來源

2013-07-18 14:03:41

這將最終拋出一個錯誤，由於無限遞歸 – cfs

@cfs我加了他的錯誤。 –

最簡單的是：

function doMyAnimations() 
{ 
    $("#club_color1 a").animate({color: '#000000'}, 1000); 
    $("#club_color2 a").animate({color: '#000000'}, 1000); 
    $("#club_color1 a").animate({color: '#FFFFFF'}, 1000); 
    $("#club_color2 a").animate({color: '#FFFFFF'}, 1000); 
    setTimeout(doMyAnimations,10000); 
}

然後調用它一次身體上的負荷：

setTimeout(doMyAnimations,10000);

來源

2013-07-18 14:12:37 RMK

循環jquery動畫

回答

相關問題