jquery slideToggle() 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
toggle
英[ˈtɒgl] 美[ˈtɑ:gl]
n.Bar button; lasso button; conversion key; switch key
v.Switch
jquery slideToggle() methodsyntax
Function: slideToggle() method switches the visible state of the element by using the sliding effect (height change). Hides the selected elements if they are visible, and shows them if the selected elements are hidden.
Syntax: $(selector).slideToggle(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 switches (this will create a sliding effect). |
callback | Optional. The function to be executed after the toggle function is executed. This parameter cannot be set unless the speed parameter is set. |
Note: If the element has been hidden, the effect will not change unless a callback function is specified.
jquery slideToggle() 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").slideToggle(); }); }); </script> </head> <body> <p>This is a paragraph.</p> <button class="btn1">Toggle</button> </body> </html>
Click the "Run instance" button to view the online instance