jQuery - 重复图像

Question

我在jQuery中有这个代码。我有6个图像的代码，但当它在6时它停止。我想重复一遍1.我怎么能这样做？

<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>

Answer 1

只需将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;      
  }
}