jQuery 效果 - slideDown() 方法[菜单导航栏常用]
实例
以滑动方式显示隐藏的 <p> 元素:
$(".btn2").click(function(){
$("p").slideDown();
});
定义和用法
slideDown() 方法通过使用滑动效果,显示隐藏的被选元素。
语法
$(selector).slideDown(speed,callback)
| 参数 | 描述 |
|---|---|
| speed |
可选。规定元素从隐藏到可见的速度(或者相反)。默认为 "normal"。 可能的值:
在设置速度的情况下,元素从隐藏到可见的过程中,会逐渐地改变其高度。 |
| callback |
可选。slideDown 函数执行完之后,要执行的函数。 如需学习更多有关 callback 的内容,请访问我们的 jQuery Callback 这一章。 除非设置了 speed 参数,否则不能设置该参数。 |
提示和注释
提示:如果元素已经是完全可见,则该效果不产生任何变化,除非规定了 callback 函数。
注释:该效果适用于通过 jQuery 隐藏的元素,或在 CSS 中声明 display:none 的元素(但不适用于 visibility:hidden 的元素)。
测试代码:
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".hide").click(function(){
$("p").slideUp(1000);
});
$(".show").click(function(){
$("p").slideDown(1000);
});
});
</script>
</head>
<body>
<button class="hide">隐藏</button>
<button class="show">显示</button>
<p>滑动隐藏和显示...</p>
</body>
</html>
jQuery 效果 - slideDown() 方法[菜单导航栏常用]的更多相关文章
- jquery自定义插件-参数化配置多级菜单导航栏插件
1 自定义菜单导航栏插件的必要性 看图说话,下面是利用自定义的菜单导航栏插件simpleMenu创建的网站导航示例: 插件默认提供的是如上图的导航栏样式,即一二级菜单为横向分布:三四级菜单为纵向分布. ...
- 用Jquery 仿VS 样式的 导航栏插件
在开发B/S 项目过程中,根据主界面设计要求,需要做一个类似VS 左边工具栏样式的菜单导航栏,在网上搜索无果后,于是决定自已做一个. 由于前台用JQuery开发, 想到网上很多人用JQuery做插件, ...
- [转]jQuery的each方法的几种常用的用法
下面提一下jQuery的each方法的几种常用的用法 复制代码 代码如下: var arr = [ "one", "two", "three&quo ...
- 用jquery制作一个简单的导航栏
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- iOS开发之 -- 判断tableview/scrollview的滑动方法,及导航栏渐变的实现代码
开发的过程中,肯定会用到在视图想上滑动的时候,在导航处做一些操作,比如向上滑动的时候,做个动画,出现一个搜索框,或者其他的操作,那么我们怎么来判断它的滑动方向呢? 首先我们应该知道tableview继 ...
- 使用Design包实现QQ动画侧滑效果和滑动菜单导航
Google在2015的IO大会上,给我们带来了更加详细的Material Design设计规范,同时,也给我们带来了全新的Android Design Support Library,在这个supp ...
- 【原创】js实现一个可随意拖拽排序的菜单导航栏
1.想做这个效果的原因主要是用在UC上看新闻发现他们的导航菜单很有趣.无聊的时候在哪划着玩了很久.所以就干脆自己写一个.原效果如下 2.整体效果如下,在已推荐和未添加里面每个小方块可以触摸移动位置互换 ...
- jQuery 效果 - animate() 方法
http://www.w3school.com.cn/jquery/effect_animate.asp 实例 改变 "div" 元素的高度: $(".btn1" ...
- jQuery 效果 - fadeTo() 方法
实例 使用淡出效果来隐藏一个 <p> 元素: $(".btn1").click(function(){ $("p").fadeTo(1000,0.4 ...
随机推荐
- Tomcat启动过程(三):从SocketProcessor到Container
1.Http11Protocol中的内部类Http11ConnectionHandler,执行其process方法 if (processor == null) { processor = creat ...
- C# 测试程序运行时间和cpu使用时间
方法一 Stopwatch类测试程序运行时间和cpu使用时间 添加命名空间using System.Diagnostics;使用实例如下 private Stopwatch sw = new Stop ...
- sql,插入最大值加1
insert into aa (id,name) values((select case when max(id) is null then 1 else max(id)+1 end from aa) ...
- 【转】MySQL GRANT REVOKE用法
MySQL的权限系统围绕着两个概念: 认证->确定用户是否允许连接数据库服务器 授权->确定用户是否拥有足够的权限执行查询请求等. 如果认证不成功的话,哪么授权肯定是无法进行的. revo ...
- Win+R快速打开你的应用程序
参考自:http://blog.csdn.net/nothing0318/article/details/7179405 1:在你的磁盘任意位置创建一个文件夹,比如C:MyShortcut,然后将你的 ...
- C# 平时碰见的问题【3】
今天发现一个问题纳闷了半个小时, 需求是处理project文件里边的数据内容,其中需要判断任务名称不存在重复; 在测试的时候弄了两行一样的任务,如预想: 任务[xxx]重复 然后删掉重复的任务行,继续 ...
- STM32F0xx_看门狗(独立+窗口)配置详细过程
Ⅰ.概述 对于看门狗,我觉得做单片机或者嵌入式开发的人员来说并不陌生,今天总结STM32F0看门狗的功能,F0的看门狗有两种:独立和窗口看门狗. 今天提供两种看门狗的软件工程实例,供大家下载. 两种看 ...
- 【原创】小白学jquery Mobile《构建跨平台APP:jQuery Mobile移动应用实战》连载五(给按钮加图标)
在范例5-4所使用的导航栏中,已经为按钮加入了图标的样式,但是当时并没有介绍按钮的图标究竟是怎么一回事.下面截取范例5-4中导航栏部分的代码: <divdata-role="foote ...
- LinearRegressionWithRegularization
在线性回归的基础上加上正则项: # -*-coding:utf-8 -*- ''' Created on 2016年12月15日 @author: lpworkdstudy ''' import nu ...
- PBOC规范(2.0->3.0)对照表
1 数据方面 TAG PBOC2.0 ...