Изображение слайдер wont fade

Question

Я пытаюсь сделать слайдер изображения jquery, но по какой-то причине выцветание не работает. Вот мой код:

sliderInt = 1; 
sliderNext = 2; 

function startSlider() { 
    count = $('#slider>a').size(); 
    loop = setInterval(function() { 


     if (sliderNext > count) { 
      sliderNext = 1; 
      sliderInt = 1; 
     } 

     $('#slider>a').fadeOut(1000); 
     $('#slider>a#'+sliderNext).show('fade',1000); 

     sliderInt = sliderNext; 
     sliderNext = sliderNext + 1; 
    },3000); 
} 

function stopLoop() { 
    window.clearInterval(loop); 
} 

$('#slider>a#1').fadeIn(1000); 
    startSlider(); 
    $('#slider>a').hover(function() { 
     stopLoop(); 
    },function() { 
     startSlider(); 
}); 

Первое замирание в идет хорошо, и Fade Out всегда работает, но $('#slider>a#'+sliderNext).fadeIn(1000); не работает

Answer 1

Edit: Я думаю, что проблема ваша

$('#slider>a#'+sliderNext).show('fade',1000); 

Вы не можете позвонить по телефону show(), как и вы, перейдя по ссылке fade. Вместо этого используйте .fadeIn(1000). Кроме того, вы можете упростить свой селектор до $('#' + sliderNext'), так как идентификаторы уникальны.
Еще одна ошибка, которую я вижу в вашем коде, находится в вашей функции startSlider, вам необходимо установить sliderNext в 2, а не 1.

Редакция 2: Проблема в вашей скрипке заключается в том, что во время перехода к постепенному исчезновению отображаются как затухание изображения, так и затухание изображения. Изображение, которое затухает, обрезается overflow: hidden. Когда старое изображение заканчивается, исчезает новое изображение, которое перемещается влево, чтобы занять место, где было старое изображение. (Надеюсь это имеет смысл). Таким образом, новый образ - это, исчезающий, он просто отключен. Вы можете это исправить, поставив fadeIn() внутри функции обратного вызова fadeOut(), как

$('#slider > a').fadeOut(1000,function(){ 
    $('#slider>a#'+sliderNext).show('fade',1000); 
})