jQuery - 重复图像

问题描述:

我在jQuery中有此代码。我有6个图像的代码,但是当它在6上时,它停止。我想从1开始重复一遍。我该怎么做?jQuery - 重复图像

<script type="text/javascript"> 
$(document).ready(function() { 

    var $slider = $('#slider'), 
     $prev = $('#prev'), 
     $next = $('#next'), 
     $slide = $slider.find('div'); 

    var currentSlide = 0, 
     allSlides = $slider.find('div').length - 1; // index start from 0 


    $slider.find('div').eq(0).show(); 

    function nextSlide() { 

     if(currentSlide < allSlides) { 

      $slide.eq(currentSlide).fadeOut('slow'); 
      $slide.eq(currentSlide + 1).fadeIn('slow'); 

      currentSlide+=1; 
     } 

    } 
    setInterval(function() { 
     nextSlide(); 
}, 5000); 
    function prevSlide() { 

     if(currentSlide > 0) { 

      $slide.eq(currentSlide).fadeOut(400); 
      $slide.eq(currentSlide - 1).fadeIn(400); 

      currentSlide-=1; 
     } 
    } 
    $next.on('click', nextSlide); 
    $prev.on('click', prevSlide); 

}); 
</script> 

只需设置currentSlide滑动,从你开始

function nextSlide() { 

    if(currentSlide < allSlides) { 

     $slide.eq(currentSlide).fadeOut('slow'); 
     $slide.eq(currentSlide + 1).fadeIn('slow'); 

     currentSlide+=1; 
    }else{ 
     currentSlide = 0; 
    } 

} 

对于prev设置currentSlide到最后一个

function prevSlide() { 

    if(currentSlide > 0) { 

     $slide.eq(currentSlide).fadeOut(400); 
     $slide.eq(currentSlide - 1).fadeIn(400); 

     currentSlide-=1; 
    }else { 
     currentSlide = allSlides-1;  
    } 
}