功能:用来显示和隐藏某个元素,例如第一次点击按钮显示元素,再次点击按钮会隐藏元素
书写格式:$(selector).toggle(speed,callback,switch)
****toggle包含三个参数speed,callback,switch.****
speed
可选。规定元素从可见到隐藏的速度(或者相反)。默认为 "0"。
可能的值:
•毫秒 (比如 1500)
•"slow"
•"normal"
•"fast"
在设置速度的情况下,元素从可见到隐藏的过程中,会逐渐地改变其高度、宽度、外边距、内边距和透明度。
如果设置此参数,则无法使用 switch 参数。
callback
这个参数是用来是否当动画执行完毕后执行其他函数,例如当动画从隐藏到显示已经执行完毕,我们想让他弹出一句话,此时就可以将弹出一句话的函数下在这里
switch
可选。布尔值。规定 toggle 是否隐藏或显示所有被选元素。
•True - 显示所有元素
•False - 隐藏所有元素
如果设置此参数,则无法使用 speed 和 callback 参数。
****效果****
****代码****
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
#content{width:200px;height: 200px;background-color: #cccccc;display: none;}
</style>
</head>
<body>
<button id="hide">显示/隐藏</button>
<div id="content">
你好!
</div>
</body>
<script src="js/jquery-3.1.1.min.js"></script>
<script>
$(document).ready(function(){
$("#hide").click(function(){
$("#content").toggle(1000,h);
})
})
var h= function hello(){
alert("hello")
}
</script>
</html>