jquery slideDown() method
Translation results：
slide
UK[slaɪd] 美[slaɪd]
vi.Slide; fall; skid; [baseball] slide
vt .fading (to); gradually lowering; to turn quietly; (to make) move quickly and quietly
n.slide; to lower
down
英[daʊn] 美[daʊn]
adv. Down; (sitting, falling, lying) down; (indicating the limit of range or sequence) down to
prep. (from High) downward; (indicating position) below; (indicating direction) down along; (indicating time) since...
adj. downward; frustrated; computer or computer System shutdown; (to...) lag behind the opponent's
n. (bird's) feathers; fluff; soft hair; hair
vt. put down; (especially with a big mouth or quickly) drink; cause to fall; shoot down (enemy aircraft, etc.)
vi. come down; descend; [often used in imperative sentences] go down; lie down
jquery slideDown() methodsyntax
Function: slideDown() method displays hidden selected elements by using the sliding effect.
Syntax: $(selector).slideDown(speed,callback)
Parameters:
| Parameter | Description |
| speed | Optional. Specifies how quickly an element goes from hidden to visible (or vice versa). Default is "normal". Possible values: milliseconds (e.g. 1500) "slow" "normal" "fast" When setting the speed, the element will gradually change its height as it goes from hidden to visible. |
| callback | Optional. The function to be executed after the slideDown function is executed. To learn more about callbacks, visit our jQuery Callback chapter. This parameter cannot be set unless the speed parameter is set. |
Note: If the element is already fully visible, the effect will not change unless a callback function is specified. The effect works on elements hidden via jQuery, or elements with display:none declared in CSS (but not elements with visibility:hidden ).
jquery slideDown() methodexample
<html>
<head>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".btn1").click(function(){
$("p").slideUp();
});
$(".btn2").click(function(){
$("p").slideDown();
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button class="btn1">Hide</button>
<button class="btn2">Show</button>
</body>
</html>Click the "Run instance" button to view the online instance