jQuery를 사용한 재귀 이미지 each()

Question

이미지가있는 자동 슬라이드 쇼를 만들어야합니다. 모든 이미지를 body 태그에 다른 위치에 넣고 싶습니다. 그래서 모든 이미지에 div를 하나 만들었습니다. 나는 그것은 작동하는 모든 이미지

<div id="img1" class="images" ><img src="img/works/img1.jpg"/></div> 
<div id="img2" class="images" ><img src="img/works/img2.jpg"/></div> 
... 


<script> 
var arr = ["img1", "img2",..., "img22" ]; 

var $fade_in=1500; 

$.each(arr, function images(i) { 
$("#" + this).delay(i*1000).show($fade_in); 
});  
</script> 

을 보여 jQuery를 각()를 사용하고 있습니다. 자, 어떻게 함수를 재귀 적으로 얻을 수 있습니까? 나는 이러한 링크, http://jsfiddle.net/maniator/F6nJu/1/ http://jsfiddle.net/JJfKM/138/ 을 보았다하지만 난 내 코드에 그들을 적용 할 수없는 무한 루프

이 필요합니다.

죄송합니다.

Answer 1

setInterval()을 사용하면 반복적으로 슬라이드를 실행할 수 있습니다.

function runSlides() { 
    var index = 0; 
    var imgList$ = $(".images"); 

    setInterval(function() { 
     // hide previous slide 
     imgList$.eq(index).hide(1500); 
     // show next slide 
     ++index; 
     if (index >= imgList$.length) { 
      index = 0; 
     } 
     imgList$.eq(index).show(1500); 
    }, 2500);  
} 

그리고, 코드에서 어떤 시점에서, 당신은 사용하여이 부를 것이다 :이 예에서

runSlides(); 

을, 나는 이전 슬라이드를 숨겨와 각 간격에서 다음 중 하나를 표시했습니다 이것은 당신이 당신의 예에서했던 것과는 다르지만, 반복해서 반복하기 위해 당신이 그런 식으로해야한다는 것을 알았습니다.

여기의 실제 작업 예제는 http://jsfiddle.net/jfriend00/4STRU/입니다.