JQuery supports the following methods to achieve the sliding effect of HTML elements: the slideDown () slideUp () slideToggle () slideDown method is used to achieve the downward sliding animation effect. Its basic syntax is: $ (selector ). slideDown (speed, callback); the optional parameter speed provides the time for the fade-in effect. You can use "slow", "fast", or a value (microsecond). The second optional parameter is the callback function, call after the slideDown () method ends. In the following example, click the button # The panel is displayed in the descending mode: [html] <! DOCTYPE html> <meta charset = "UTF-8"> <title> JQuery Demo </title> <script src = "scripts/jquery-1.9.1.js"> </script> <script> $ (document ). ready (function () {$ ("# flip "). click (function () {$ ("# panel "). slideDown ("slow") ;}) ;}; </script> <style type = "text/css" >#panel, # flip {padding: 5px; text-align: center; background-color: # e5eecc; border: solid 1px # c3c3c3 ;}# panel {padding: 50px; display: None ;} </style>