jQuery slideDown()Method

jQuery 效果方法jQuery Effects Methods

Example

Display all hidden <p> elements with a sliding effect:

$("button").click(function(){
$("p").slideDown();
});

Try it Yourself »

Definition and Usage

The slideDown() method displays the selected elements with a sliding effect.

Note:slideDown() works on elements hidden by jQuery methods or hidden with display:none in CSS (but does not work on elements hidden with visibility:hidden).

Tip:To hide elements with a sliding effect, seeslideUp()method.

Syntax

$(selector).slideDown(speed,easing,callback)

Parameter Description
speed Optional. Specifies the speed of the sliding effect.

Possible values:

  • Milliseconds
  • "slow"
  • "fast"
easing Optional. Specifies the speed of the element at different points of the animation. Default value is "swing".

Possible values:

  • "swing" - moves slower at the beginning/end, but faster in the middle
  • "linear" - moves at a constant speed
Tip:More easing functions are available in plug-ins.
callback Optional. A function to execute after the slideDown() method is completed.

To learn more about callbacks, please visit ourjQuery Callbackchapter.

实例

More Examples

slideDown() - Using the speed parameter
How to use the speed parameter to specify the speed of the sliding effect.

slideDown() - Using the callback parameter
How to use the callback parameter when sliding selected elements up and down.

jQuery 效果方法jQuery Effects Methods

Other Extensions