jQuery fade слайдер не переходит

Question

Я пытаюсь сделать маленький слайдер jquery, чтобы просто исчезать между изображениями, однако когда он переходит к следующему слайду, он показывает слайд на секунду, а затем возвращается к первому , Я не лучший с jquery, не говоря уже о JavaScript, я парень PHP/BASH.

http://jsfiddle.net/mrVGL/3/

JQuery

    // Start Slides 

        $('#hi1').fadeTo("slow", 1.0, function() { 

         var slide = 1, 
          slides = 4 
          ids = [ 
           '#hi1', 
           '#hi2', 
           '#hi3', 
           '#hi4', ], 
          slideShow = setInterval(function() { 
           var nextSlide = slide + 1; 
           if (slide >= slides) { 
            nextSlide = 1; 
           } 
           $(ids[nextSlide]).fadeTo("fast", 1.0, function() { 
            $(ids[slide]).fadeTo("slow", 0); 
           }); 
           slide++; 
           if (slide >= slides) { 
            slide = 1; 
           } 
          }, 5000); 
         // End Slides 

        }); 

Answer 1

nextslide проверка прошла подсчет, потому что вы были проверки текущего слайда. Сначала затухайте свой предыдущий слайд, затем fadein на предстоящем. Индекс массива начинается с 0, поэтому имеет смысл запустить переменную, представляющую индекс массива с 0.

В любом случае попробуйте следующее! :)

// Start Slides 
$('#hi1').fadeTo("slow", 1.0); 
var slide = 0, 
ids = [ 
    '#hi1', 
    '#hi2', 
    '#hi3', 
    '#hi4', ], 
countSlides = slides.length, 
slideShow = setInterval(function() { 
    var nextSlide = slide + 1; 
    if (nextSlide > countSlides - 1) { 
     nextSlide = 0; 
    } 
    $(ids[slide]).fadeTo("slow", 0); 
    $(ids[nextSlide]).fadeTo("fast", 1.0); 
    slide++; 
    if (slide > countSlides - 1) { 
     slide = 0; 
    } 
}, 1000);