在实际的项目开发中,要使一个元素隐藏的方法有很多,比如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中使元素显示和隐藏方法之间的区别的更多相关文章

  1. 教你三种jQuery框架实现元素显示及隐藏动画方式

    摘要:在jQuery框架中对元素对象进行显示和隐藏有三种方式,分别是"默认方式显示和隐藏"."滑动方式显示和隐藏"."淡入淡出显示和隐藏". ...

  2. Jquery中删除元素方法

    empty用来删除指定元素的子元素,remove用来删除元素,或者设定细化条件执行删除 语法: empty() remove(expr); empty用来删除指定元素的子元素,remove用来删除元素 ...

  3. jquery中交替点击事件toggle方法的使用示例

    jquery中交替点击事件toggle方法中有两个参数,分别是要交替执行的事件.如果不传参默认是显示隐藏功能,下面有个不错的示例,感兴趣的朋友可以参考下 复制代码代码如下: $('#clickId‘) ...

  4. jquery判断div是否显示或者隐藏

    jquery判断div是否显示或者隐藏 很多时候会要判断一个div是不是显示着,没显示要怎么处理,显示的如何处理: 方法很简单,选择到你要判断的div,再用is(':hidden')判断是否隐藏:或者 ...

  5. css控制div显示/隐藏方法及2种方法比较原码 - czf164的专栏 - 博客频道 - CSDN.NET

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

  6. jQuery如何判断元素是否是隐藏的?

    jQuery函数简介: is(expr) 用一个表达式来检查当前选择的元素集合,如果其中至少有一个元素符合这个给定的表达式就返回true. 如果没有元素符合,或者表达式无效,都返回'false'. 注 ...

  7. Jquery中each的三种遍历方法

    Jquery中each的三种遍历方法 $.post("urladdr", { "data" : "data" }, function(dat ...

  8. unity3d中让物体显示和隐藏

    unity3d中让物体显示和隐藏的方法 gameObject.renderer.enabled //是控制一个物体是否在屏幕上渲染或显示  而物体实际还是存在的 仅仅是想当于隐身 而物体本身的碰撞体还 ...

  9. jquery中获取iframe的id的方法:

    jquery中获取iframe的id的方法: var frameId = window.frameElement && window.frameElement.id || ''; al ...

随机推荐

  1. 掌握闭包closure (含义及优缺点)

    个人认为闭包其实非常好理解,我们一起去认识什么是闭包. 在javascript脚本语言中,变量的作用域只有两种,一种是全局变量,一种是局部变量. 全局变量的函数可以在整个javascript脚本语言中 ...

  2. win平台下Path变量消失问题

    解决方法:2019.01.10文章转载自 李北北:https://www.jianshu.com/p/b89f0c99867e 问题描述:修改了path变量,但是环境变量中path消失,于是想再次打开 ...

  3. MySQL造数据脚本-亲试

    DELIMITER $$CREATE DEFINER=`root`@`192.168.2.254` PROCEDURE `pjzzspdz_fpmx_initdata12101245`()BEGIN ...

  4. 双列集合Map

    1.双列集合Map,就是存储key-value的键值对. 2.hashMap中键必须唯一,值可以不唯一. 3.主要方法:put添加数据    getKey---通过key获取数据    keySet- ...

  5. 注册COMDLG32.OCX方法

    1.将下载的comdlg32.ocx文件拷贝到C:\Windows\SysWOW64(32位电脑为C:\Windows\System32)文件夹中. 2.按win+x打开快捷命令选项菜单: 再按“A” ...

  6. 使用blas做矩阵乘法

      #define min(x,y) (((x) < (y)) ? (x) : (y)) #include <stdio.h> #include <stdlib.h> # ...

  7. day37-多进程多线程二-锁

    Lock组件 当我们用多进程来读写文件的时候,如果一个进程是写文件,一个进程是读文件,如果两个文件同时进行,肯定是不行的,必须是文件写结束以后,才可以进行读操作.或者是多个进程在共享一些资源的时候,同 ...

  8. 网络知识梳理--OSI七层网络与TCP/IP五层网络架构及二层/三层网络(转)

     reference:https://www.cnblogs.com/kevingrace/p/5909719.html https://www.cnblogs.com/awkflf11/p/9190 ...

  9. powerdesigner(数据设计工具)

    https://jingyan.baidu.com/album/4f7d57120468c91a2019279f.html?picindex=1  (摘抄 原网地址)

  10. python单例(重点)

    单例 目标 单例设计模式 __new__ 方法 Python 中的单例 01. 单例设计模式 设计模式 设计模式 是 前人工作的总结和提炼,通常,被人们广泛流传的设计模式都是针对 某一特定问题的成熟的 ...