2012-08-31 7 views
0

다음 및 이전 화살표를 사용하여 이미지를 전환하려고하고 next()를 사용하여 다음 이미지를 흐리게 표시하지만 이미지가 남아 있지 않으면 첫 번째 이미지에서 분명히 재활용되지 않습니다 . 이 코드를 작동시키고 다음 버튼을 해당 클래스의 이미지 요소 끝에 도달 한 후 첫 번째 이미지로 이동시키는 방법.순환 모드에서 다음 요소로 스크롤

내 코드 : 거기에 다음 요소이며, 그렇지 않은 경우

$('.nextImage').live('click',function(){ 
    $('.main-image .zoom:visible').fadeOut(800); 
    $('.main-image .zoom:visible').next().fadeIn(800); 
}); 

답변

2

그냥 테스트, 처음으로 돌아갑니다.

$('.nextImage').on('click',function(){ // .live() is deprecated 
    var $img = $('.main-image .zoom:visible').last(), // just want one 
     $next = $img.next(); 
    if (0==$next.length) { 
     $next = $img.siblings().first(); 
    } 
    $img.fadeOut(800); 
    $next.fadeIn(800); 
}); 

http://jsfiddle.net/tAChA/

+0

+1 단지 [요다 조건] 대 (http://www.codinghorror.com/blog/2012/07/new-programming-jargon.html)! – adeneo

+0

끝까지 도달했을 때 첫 번째 항목으로 사라지지 않는 이유는 모르겠지만 대신 마지막 항목 이전의 항목으로 이동 한 다음 마지막 항목으로 되돌아갑니다. : –

+0

업데이트가 너무 빠르면 항목과 관련이 있다고 생각합니까? fadeOut, fadeIn 전환을 완료해야합니까? –

관련 문제