0

I have some jQuery for an image slider but for some reason my fadeIn effect only works on the first slide and the fadeOut effect works on all slides except the last one. I'm a beginner when it comes to jQuery so it might be something really simple. Below is the jQuery code for the slider, any help is greatly appreciated!

sliderInt=1;
sliderNext=2;

$(document).ready(function(){
    $("#slider>img#1").fadeIn(300);
    startSlider();
});


function startSlider(){
    count=$("#slider>img").size();

    loop=setInterval(function(){

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

        $("#slider>img").fadeOut(1000);
        $("#slider>img#"+sliderNext).fadeIn(1000);

        sliderInt=sliderNext;
        sliderNext=sliderNext+1;

    },5000);
}
Tyharo
  • 383
  • 2
  • 5
  • 23

1 Answers1

1

Try changing:

 $("#slider>img#"+sliderNext).fadeIn(1000);

To:

 $("#slider>img#"+sliderNext).fadeIn(2000);

I also made a example here : jsfiddle

Tony Chen
  • 501
  • 4
  • 16
  • No luck, thanks for the quick response though! Thats actually the first thing I tried before posting this question. – Tyharo Aug 07 '14 at 17:33
  • But i have use your code up there, and it works well. Maybe something else is wrong. – Tony Chen Aug 07 '14 at 17:41
  • I cleared my browser cache after setting your values and it works now, this is embarrassing. Thanks for the help Tony! – Tyharo Aug 07 '14 at 17:45