jquery中使元素显示和隐藏方法之间的区别
在实际的项目开发中,要使一个元素隐藏的方法有很多,比如css的多种属性和jquery的多种方法,虽然他们的作用都是使元素不可见,但是各个方法实现的原理是不一样的。下面主要介绍jquery各个元素隐藏方法之间的区别。
1、show()和hide()
使用hide()方法隐藏元素实际上是同时减少元素的高度、宽度以及不透明度,直到这三个属性为0,最后设置元素的css属性disolay:none。show()方法从上到下增大元素的高度,从左到右增大元素的宽度,同时增加内容的不透明度,直至元素完全显示。
2、fadeIn()和fadeOut()
这两种方法使元素隐藏或显示的时候只改变元素的不透明度。
3、slideUp()和slideDown()
这两种方法使元素隐藏或显示的时候只改变元素的高度。slideDown()显示的时候是从上到下,slideUp()隐藏时是从下到上。
上述三种方法里面都可以传递两个参数,第一个参数是元素显示或隐藏的过度效果,可以传递具体的时间值,也可以传递各个方法规定好的显示隐藏方式值,第二个是回调函数,在元素显示或隐藏后要执行的其他操作。
除了以上介绍的方法外,jquery的animate()方法也可以使元素隐藏,它的原理是使用css的属性。该方法可以接受三个参数,第一个是css属性,第二个是过度效果,第三个是回调函数。
jquery中使元素显示和隐藏方法之间的区别的更多相关文章
- 教你三种jQuery框架实现元素显示及隐藏动画方式
摘要:在jQuery框架中对元素对象进行显示和隐藏有三种方式,分别是"默认方式显示和隐藏"."滑动方式显示和隐藏"."淡入淡出显示和隐藏". ...
- Jquery中删除元素方法
empty用来删除指定元素的子元素,remove用来删除元素,或者设定细化条件执行删除 语法: empty() remove(expr); empty用来删除指定元素的子元素,remove用来删除元素 ...
- jquery中交替点击事件toggle方法的使用示例
jquery中交替点击事件toggle方法中有两个参数,分别是要交替执行的事件.如果不传参默认是显示隐藏功能,下面有个不错的示例,感兴趣的朋友可以参考下 复制代码代码如下: $('#clickId‘) ...
- jquery判断div是否显示或者隐藏
jquery判断div是否显示或者隐藏 很多时候会要判断一个div是不是显示着,没显示要怎么处理,显示的如何处理: 方法很简单,选择到你要判断的div,再用is(':hidden')判断是否隐藏:或者 ...
- css控制div显示/隐藏方法及2种方法比较原码 - czf164的专栏 - 博客频道 - CSDN.NET
body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...
- jQuery如何判断元素是否是隐藏的?
jQuery函数简介: is(expr) 用一个表达式来检查当前选择的元素集合,如果其中至少有一个元素符合这个给定的表达式就返回true. 如果没有元素符合,或者表达式无效,都返回'false'. 注 ...
- Jquery中each的三种遍历方法
Jquery中each的三种遍历方法 $.post("urladdr", { "data" : "data" }, function(dat ...
- unity3d中让物体显示和隐藏
unity3d中让物体显示和隐藏的方法 gameObject.renderer.enabled //是控制一个物体是否在屏幕上渲染或显示 而物体实际还是存在的 仅仅是想当于隐身 而物体本身的碰撞体还 ...
- jquery中获取iframe的id的方法:
jquery中获取iframe的id的方法: var frameId = window.frameElement && window.frameElement.id || ''; al ...
随机推荐
- tcp协议以及socket介绍
壹:tcp协议:可靠传输 一: 3次握手,建立链接:4次挥手,断开链接 3次握手,建立链接:图解 ,这样双向通路就建立完成了. 在建立链接时,并没有数据传输,所以中间两部可以合在一起,也就是3次握手, ...
- Tomcat配置服务和自启动
Tomcat配置服务和自启动1.Tomcat配置服务 假设Tomcat的安装路径为/usr/local/tomcat 1 为Tomcat添加启动参数 catalina.sh在执行的时候会调用同级路径下 ...
- zookeeper及kafka集群搭建
zookeeper及kafka集群搭建 1.有关zookeeper的介绍可参考:http://www.cnblogs.com/wuxl360/p/5817471.html 2.zookeeper安装 ...
- fastDfs V5.02 升级到 V5.08版本后,启动报错:symbol lookup error: /usr/bin/fdfs_trackerd: undefined symbol: g_current_time
/libfastcommon-1.0.36 # ./make.sh cc -Wall -D_FILE_OFFSET_BITS=64 -D_GNU_SOURCE -g -O3 -c -o hash.o ...
- HTML table导出到Excel中的解决办法
第一部分:html+js 1.需要使用的表格数据(先不考虑动态生成的table) <table class="table tableStyles" id="tabl ...
- Python3+mitmproxy安装使用教程(Windows)
一.安装 1.1 安装mitmproxy 直接使用pip安装即可 pip install mitmproxy pip本质上会一是安装mitmproxy库的相关代码,二是安装mitmproxy.exe/ ...
- Vue入门笔记(一)--基础部分
github地址:https://github.com/iTao9354/basicVue(demo01-28) 一.初识Vue 使用双大括号{{message}}将数据渲染进DOM中. 可 ...
- python私有属性和私有方法
私有属性和私有方法 01. 应用场景及定义方式 应用场景 在实际开发中,对象 的 某些属性或方法 可能只希望 在对象的内部被使用,而 不希望在外部被访问到 私有属性 就是 对象 不希望公开的 属性 私 ...
- springcloud学习计划
后续参考学习spring cloud https://blog.csdn.net/forezp/article/details/70148833 https://github.com/forezp/S ...
- bfs两种记录路径方法
#include<cstdio> #include<queue> using namespace std; struct sss { int x,y; }ans[][]; ][ ...