滑块不循环两次?

时间:2014-09-15 12:59:56

标签: javascript jquery

我无法弄清楚为什么我的滑块不会在我的变量numSlides中的所有3张幻灯片中循环两次然后在第三张图片从最后一个循环淡出后,在第一张图片中淡入然后停止。有什么想法吗?我已经打了一个块。

var slide = $(".container .slide");
var slideIndex = -1;
var numSlides = 3;

function showNextSlide() {
    if (slideIndex < 2* numSlides) {
        ++slideIndex;
        slide.eq(slideIndex % slide.length)
            .fadeIn(700)
            .delay(4000)
            .fadeOut(700, showNextSlide)
            .delay(11000);
            $('.container .slide:first-child').fadeIn(700);
    }
}    

showNextSlide();

http://jsfiddle.net/wyz6c873/

1 个答案:

答案 0 :(得分:1)

你应该重新定义slideIndex

   function showNextSlide() {
        if (slideIndex < 2* numSlides) {
            ++slideIndex;
            slide.eq(slideIndex % slide.length)
                .fadeIn(700)
                .delay(4000)
                .fadeOut(700, showNextSlide)
                .delay(11000);
                $('.container .slide:first-child').fadeIn(700);
        } else slideIndex = -1;
    }