Javascript jquery淡入/淡出循环，如何使用计时器？

javascript等新手，尝试使用jquery创建一个用于淡化徽标的循环。

我已经让它骑自行车就好了。 但我试图使循环连续; 这样，当它到达最后一个标志时，它会回到开头，每次到达最后一个标识时，将我的柜台重置为0。 这导致了无限循环，我认为这会使我的浏览器崩溃。 所以我做了一个快速谷歌并发现了window.setInterval（…）计时器function。

我的问题是，现在解雇循环代码依赖于时间，我无法弄清楚如何计算间隔时间。 这里的参考是用于淡入和淡出徽标的代码（在尝试循环之前）：

$(document).ready(function (){ var fadeDuration = 1000; var timeBetweenFade = 2000; var totalTimePerChange = fadeDuration + timeBetweenFade; var totalLogos = $('.logo').length; var currentLogo; var i; for(i = 0; i < totalLogos; i++) { currentLogo = "#img" + i; if(i == 0){ $(currentLogo).fadeIn(fadeDuration).delay(timeBetweenFade).fadeOut(fadeDuration); } else{ //general case $(currentLogo).delay(totalTimePerChange * i).fadeIn(fadeDuration).delay(timeBetweenFade).fadeOut(fadeDuration); } } }); 

我试图通过几种方式获得完整循环的时间：

 $(document).ready(function (){ //..declarations.. window.setInterval( function() { //..FOR LOOP HERE.. }, i*(fadeDuration + timeBetweenFade + fadeDuration)); }); //I also tried.. $(document).ready(function (){ //..declarations.. var timeTakenToLoop; var startLoopTime; window.setInterval( function() { startLoopTime = new Date().getTime(); //...FOR LOOP HERE.. timeTakenToLoop = new Date().getTime() - startLoopTime; }, timeTakenToLoop); }); 

但在这两种情况下，我都会发现徽标开始重叠，因为函数调用时机是错误的。 有经验的人可以提出最好的方法吗？

哦，以防万一有人需要它来理解javascript，这里是匹配的html ..

  
  
 
  
 
I can fade too 

Answer 1

简单的jQuery方法，没有setTimeout ，也没有setInterval 。

 var loop = function(idx, totalLogos) { var currentLogo = "#img" + idx; $(currentLogo) .delay(currentLogo) .fadeIn(fadeDuration) .delay(currentLogo) .fadeOut(fadeDuration, function(){ loop( (idx + 1) % totalLogos, totalLogos); }); } loop(0, $('.logo').length);​ 

在这里看到它 。