不断迭代jQuery中每一个（）循环？

Question

是否有可能持续运行在jQuery的每个（）循环？

我有一个在淡出图像的幻灯片，并从海誓山盟但是当它到达它停在最后一图像。我的代码如下：

jQuery的

$('.slider-block').each(function(i) {

$(this).delay(4000*i).fadeTo(1000,1);

});

HTML

<div class="slider-block">

<img src="image1.png" />

</div>

<div class="slider-block">

<img src="image2.png" />

</div>

CSS

.slider-block { display: none; position: absolute; top: 0px; left: 0px; }

我的目标是有它遍历所有的图像，然后再回到第一个，从头再来。

所有的HTML和CSS工作得很好，它真的只jQuery的一部分，我需要在这里帮助。

**更新**

根据建议，我曾尝试以下，但是，没有这些循环的通过再次开始：

setTimeout(function(){  

$('.slider-block').each(function(i) { 

$(this).delay(4000*i).fadeTo(1000,1); }); 

} ,4000);

和

setInterval(function(){  

$('.slider-block').each(function(i) { 

$(this).delay(4000*i).fadeTo(1000,1); }); 

} ,4000);

而这一次崩溃我的浏览器

while(true)
{
   $('.slider-block').each(function(i) {

       $(this).delay(4000*i).fadeTo(1000,1);

   });
}

Answer 1

解：

function cycleImages(){
    var $active = $('#slider-container .active');
    var $next = ($active.next().length > 0) ? $active.next() : $('.slider-block:first');
      $next.css('z-index',2);//move the next image up the pile
      $active.fadeOut(1500,function(){//fade out the top image
          $active.css('z-index',1).show().removeClass('active');//reset the z-index and unhide the image
          $next.css('z-index',3).addClass('active');//make the next image the top one
      });
}        
$(function(){
    // run every 4s
    setInterval('cycleImages()', 4000);            
});

EDITED答（V2）：

顶部图像具有“3”的z索引。下一个图像被置于下方使用的“2”的z索引。因此，通过淡出顶部图像，你有这样的印象，这是无缝褪色英寸

但是：四联zxsw POI

注意：此方法不会因为透明度问题型“巴纽”的影像工作。通过优先使用JPEG图像。

来源：http://jsfiddle.net/UhJm6/1/

Answer 2

您可以使用JavaScript的http://www.simonbattersby.com/blog/simple-jquery-image-crossfade/函数来创建一个无限循环。

阅读更多setTimeout()。

如果你不希望任何停顿，只需设置相应的超时时间。

或任你可以使用这个

here

Answer 3

你可以使用

While(true)
{
   $('.slider-block').each(function(i) {
       $(this).delay(4000*i).fadeTo(1000,1);
   });
}

的完整参数设置下一个褪色这样的：

fadeTo

但是，你可以选择隐藏他们回来，一旦你到达循环结束，否则他们将是最后一个被隐藏。类似的东西：

function fadeImg(i) {
    $('.slider-block').eq(i).delay(4000 * i).fadeTo(1000, 1, function () {
        fadeImg(i);
    });
}
$('.slider-block').each(function (i) {
    fadeImg(i);
});

样品

function fadeIn(i) {
    $('.slider-block').eq(i).delay(4000 * i).fadeTo(1000, 1, function () {
        fadeIn(i);
        fadeOut(i);
    });
}
function fadeOut(i) {
    $('.slider-block').eq(i).delay(4000 * (i+1)).fadeTo(1000, 0);
}
$('.slider-block').each(function (i) {
    fadeIn(i);
});

Answer 4

让我们想象一下，你想要做一个“每个”不断下面阵：

here

你可以写一个函数行走在这个阵列上，然后当你到达最后一个，你可以再次运行功能：

var your_array = [1, 2, 3];