多个图像的jQuery无限淡入/淡出循环

Question

所以我制作了这个网站 designq.ru

您可以看到网站进行了淡入/淡出和倒退的循环。但我不知道如何使它成为一个无限循环。我尝试过使用 while (1

<ul>
<li><a href="industrial.html"><img id="test1" src="71.jpg" alt="81.jpg""></a></li>
<li><a href="sites.html"><img id="test2" src="72.jpg" alt="82.jpg"> </a></li>
<li><a href="interior.html"><img id="test3" src="73.jpg" alt="83.jpg""></a></li>
<li><a href="style.html"><img id="test4" src="74.jpg" alt="84.jpg"></a></li>
<li><a href="furniture.html"><img id="test5" src="75.jpg" alt="85.jpg"></a></li>
<li><a href="politech.htm"><img id="test6" src="86.jpg" alt="87.jpg"></a></li>
</ul>

<script>
var vvv = function(x){
var ASD = $("#test"+x).attr('alt');
var ZXC = $("#test"+x).attr('src');
$("#test"+x).hide('fade', 2000, function() {
$("#test"+x).attr('alt', ZXC);
$("#test"+x).attr('src', ASD).show('fade', 2000);
    });
};

var ggg = function(){
setTimeout('vvv(1)',2000);
setTimeout('vvv(2)',5000);
setTimeout('vvv(3)',8000);
setTimeout('vvv(4)',11000);
setTimeout('vvv(5)',14000);
setTimeout('vvv(6)',17000);

setTimeout('vvv(1)',20000);
setTimeout('vvv(2)',23000);
setTimeout('vvv(3)',26000);
setTimeout('vvv(4)',29000);
setTimeout('vvv(5)',32000);
setTimeout('vvv(6)',35000);
};
$(document).ready(ggg () );
</script>

Answer 1

您可以使用单个 setInterval 来代替 setTimeout

(function() {
    var counter = 1;
    setInterval(function() {
        vvv(counter++);

        if(counter === 7) counter = 1;
    }), 3000);
})();