CODEWITHSUNDEEP
javascriptjqueryimagesliderfade
Sebastian Salines
Sebastian Salines

Reputation: 81

Fading an image into another image

So I'm trying to make a slider with jQuery, but I can't get the effect right... I want it to be so when I click an image it fades into another one like on this slider: http://na.leagueoflegends.com

The normal fadeIn()/fadeOut() effects aren't exactly what I'm looking for, I want it to be smoother and also not to fade into black before the second image fades in.

Would putting two divs (one absolutely positioned over the other) and then fading the one on top work?

Thanks in advance, cheers!

Upvotes: 2

Views: 802

Answers (1)

mohkhan
mohkhan

Reputation: 12305

Something like this should work

$("your img 1").animate({opacity : 0}, 300, function(){ // Fade out
    $("your img 2").animate({opacity : 1}, 200, function(){ // Fade in

    });
});

Upvotes: 1

Related Questions