jQuery 效果 - slideToggle() 方法
2016-05-13 22:03
483 查看
定义和用法
slideToggle() 方法通过使用滑动效果(高度变化)来切换元素的可见状态。如果被选元素是可见的,则隐藏这些元素,如果被选元素是隐藏的,则显示这些元素。
语法
$(selector).slideToggle(speed,callback)
参数 | 描述 |
---|---|
speed | 可选。规定元素从隐藏到可见的速度(或者相反)。默认为 "normal"。 可能的值: 毫秒 (比如 1500) "slow" "normal" "fast" 在设置速度的情况下,元素在切换的过程中,会逐渐地改变其高度(这样会创造滑动效果)。 |
callback | 可选。toggle 函数执行完之后,要执行的函数。 如需学习更多有关 callback 的内容,请访问我们的 jQuery Callback 这一章。 除非设置了 speed 参数,否则不能设置该参数。 |
实例
通过使用滑动效果,在显示和隐藏状态之间切换 <p> 元素:<html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".btn1").click(function(){ $("p").slideToggle(1000); }); }); </script> </head> <body> <p>This is a paragraph.</p> <button class="btn1">Toggle</button> </body> </html>
本文转自:http://www.w3school.com.cn/jquery/effect_slidetoggle.asp
相关文章推荐
- jQuery 事件 - mousedown() 方法
- 用jQuery实现轮播banner
- click.xxx事件触发,参考jquery源码
- 一个jquery tooltip plugin
- jquery下载保存文件
- 用jQuery实现读取checkbox所有已选项的value值
- 用原生javascript写出jquery中slideUp和slideDown效果
- jquery------.resizable()的使用
- jQuery 操作Cookie 存储 读取 删除等
- jquery------.mouseover()和.mouseout()的高级效果使用
- 【B/S】引用Google或微软的CDN加载jQuery
- jquery 选择器
- 【笔记】 《js权威指南》- 第19章 JQuery类库 - 19.2 JQuery getter setter
- 【B/S】jQuery简介及语法
- jquery中的each用法以及js中的each方法实现实例
- 利用jquery制作滚动到指定位置触发动画
- jquery选择器篇
- 原生js和jquery分别实现横向导航菜单效果
- 实例讲解Jquery中隐藏hide、显示show、切换toggle的用法
- 利用jQuery对插件进行扩展时,方法$.extend()、$.fn.extend()区别与联系