Home/Jquery/.slideDown() Effect in Jquery

.slideDown() Effect in Jquery


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


.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).
CallbackA function to call once the animation is complete.


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.


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.


Leave a Reply