Change the jquery show()/hide() animation?

问题:

By default if you specify a speed jquery adds a weird looking animation where it expands from the left end corner. I want it to just slide down. Is there a way to do that without importing something else like jquery UI ?

I'm looking something in the lines of :

$("test").show('slow', {animation:'slide'})

If there's no way, then what would be the lightest solution to do this?

Thanks

回答1:

There are the slideDown, slideUp, and slideToggle functions native to jquery 1.3+, and they work quite nicely...

http://docs.jquery.com/Effects

You can use slideDown just like this:

$("test").slideDown("slow");

And if you want to combine effects and really go nuts I'd take a look at the animate function which allows you to specify a number of CSS properties to shape tween or morph into. Pretty fancy stuff, that.

回答2:

Use slidedown():

$("test").slideDown("slow");

回答3:

You can also use a fadeIn/FadeOut Combo, too....

$('.test').bind('click', function(){
    $('.div1').fadeIn(500); 
    $('.div2').fadeOut(500);
    $('.div3').fadeOut(500);
    return false;
});