CODEWITHSUNDEEP
jqueryanimation
Jiew Meng
Jiew Meng

Reputation: 88357

How might I fade + slide an element in?

I want to slide + fade an element in, when I try doing 

$("ul", this).fadeIn(300).slideDown(600);

I just get the fadeIn, how can I fade while slide an element in?

Upvotes: 4

Views: 3603

Answers (3)

Ruttyj
Ruttyj

Reputation: 943

this will slide down then fade in

insert this function somewheres

jQuery.fn.doubleHide = function(){
    return $(this).hide().css('opacity', '0');
}


jQuery.fn.slideFade = function(slide, fade){
return $(this).slideDown(slide, function () {
    $(this).fadeTo(fade, 100);
    });
}

then u can call this function like the fadeIn()

        $(this).stop(true).doubleHide().slideFade(400, 2000);

Upvotes: 2

lc0
lc0

Reputation: 664

You can use animation for this

$("ul").animate({
"height": "toggle", "opacity": "toggle" 
}, "slow");

Upvotes: 9

TheDeveloper
TheDeveloper

Reputation: 422

Try calling hide() on it first, either in chaining or otherwise, and swap the functions around, :

$("ul").hide().slideDown(600).fadeIn(300);

Upvotes: 1

Related Questions