jquery中的
toggle和slideToggle 方法,都可以实现对一个元素的显示和隐藏。强大啊~
区别是:
toggle:动态效果为从右至左。横向动作。
slideToggle:动态效果从下至上。竖向动作。
so,比如想实现一个树由下至上收缩的动态效果,就使用slideToggle就ok了。
此外,toggle和slideToggle 还有一些参数可以设置,具体看jQuery的API就可以了~
toggle的用法:
<script src="http://ajax.googleapis.com/ajax/libs/<a%20style=" color: text-decoration:underline title="jquery" href="https://www.php.cn/zt/15736.html" target="_blank">jquery/1.3.2/jquery.min.js"></script>
<script language="<a href=" http: target="_blank">JavaScript"><br/>$(function(){<br/> $("#z").toggle(<br/> function(){<br/> alert(1);<br/> },<br/> function(){<br/> alert(2);<br/> },<br/> function(){<br/> alert(3);<br/> }<br/> );<br/> $("#x").click(function(){<br/> $("#z").toggle(<br/> function(){<br/> alert(1);<br/> },<br/> function(){<br/> alert(2);<br/> },<br/> function(){<br/> alert(3);<br/> }<br/> );<br/> });<br/>})<br/></script>
width:100px; height:100px; background-color:red;" id="z">
slideToggle的用法:
<script src="jquery-1.9.1.js" type="text/javascript"></script>
<script type="text/javascript"><br/> $(function () {<br/> $('#Button1').bind('click', function () {<br/> $('img').slideUp(2000);<br/> });<br/> $('#Button2').bind('click', function () {<br/> $('img').slideDown(2000);<br/> });<br/> $('#Button3').bind('click', function () {<br/> $('img').slideToggle(2000);<br/> })<br/> })<br/> </script>
value="下拉" />











