Site icon Dotnet Helpers

.slideDown() Effect in Jquery

Description:

Jquery slideDown() method slide down the matched elements with a sliding motion.

Syntax

.slideDown( duration, easing, complete/callback )

Ex :

Duration/speed  It specifies the speed of the fadein. The valuse may be slow, fast and milliseconds. (default value: 400). Duration are given in milliseconds and higher values indicate slower animations, not faster ones.
Easing  It specifies the easing function to be used for transition (default value: swing).
Callback A function to call once the animation is complete.

Example:

From the below code, slideDown() method will apply slide down to the selected element and apply “display:block” to the element. The .slideDown() method animates the height of the matched elements. This causes lower parts of the page to slide down, making way for the revealed items.

Output:

After clicking the “Click to slide down” button, then the “divpanelBox” will slide down with animation. Finally “display:block” will append to the div to make it visible.

Exit mobile version