toggle()方法:

定义和用法

切换元素的可见状态。如果被选元素可见,则隐藏这些元素,如果被选元素隐藏,则显示这些元素。

语法:

$(selector).toggle(speed,callback,switch)

slideToggle()方法:

定义和用法

它通过使用滑动效果(高度变化)来切换元素的可见状态。如果被选元素是可见的,则隐藏这些元素,如果被选元素是隐藏的,则显示这些元素。

语法:

$(selector).slideToggle(speed,callback)

toggle()方法与slideToggle()方法区别在于,toggle方法的效果是从右到左,是一个横向的动作。它是通过display的状态来判断匹配元素的可见性。而slideToggle()方法的效果是从上到下,是一个竖向的动作,它是通过高度来判断匹配元素的可见性。

fadeToggle()方法:

定义和用法

fadeToggle() 方法在 fadeIn() 和 fadeOut() 方法之间切换。

如果元素是淡出显示的,fadeToggle() 会使用淡入效果显示它们。

如果元素是淡入显示的,fadeToggle() 会使用淡出效果显示它们。

语法

$(selector).fadeToggle(speed,easing,callback)

这三个方法的参数中,参数均是可选的。第一个参数speed表示的切换两种状态的速度,可以用"slow"、"fast" 或毫秒。

参数callback表示的是动作完成后所执行函数的名称。

toggle()中的switch参数是可选的布尔值:True和False,表示toggle是否隐藏或显示所有的被选元素。若设置参数,则无法使用前两个参数。

fadeToggle()中的easing参数是可选的,表示的是在不同点上元素的速度

jQuery中toggle与slideToggle以及fadeToggle之间的不同的更多相关文章

  1. jQuery中toggle与slideToggle以及fadeToggle的显示、隐藏方法的比较

    1.区别 ①动画效果的比较: toggle:直接显示.隐藏,如果有[时间参数]且[匹配的元素有宽度属性],则动态效果为左上角-右下角拉卷效果,透明度0-1之间的变化:若有时间参数但是[匹配的元素没有宽 ...

  2. jQuery-4.动画篇---动画切换的比较(toggle与slideToggle以及fadeToggle的比较)

    jQuery中toggle与slideToggle以及fadeToggle的比较 操作元素的显示和隐藏可以有几种方法.例如: 改变样式display为none 设置位置高度为0 设置透明度为0 都能达 ...

  3. 关于jQuery中toggle()函数的使用

    今天遇到一个有趣的例子,将它记录下来. 一个一级菜单,里边有一个二级菜单,二级菜单是通过锚点来链接页面元素的.想要实现的效果是当点击锚点时,页面链接到相应锚点,同时二级菜单隐藏,再点击一级菜单时,继续 ...

  4. jQuery中,子页面与父页面之间的调用方法

    在jQuery中, 子页面查找父页面的元素 parent.$("#元素Id") 父页面调用子页面的元素 $("#子页面iframe的Id").contents( ...

  5. Jquery中toggle的用法详情

    jquery ----toggle([speed],[easing],[fn]) 用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的click事件 如果元素是可见的,切换为隐藏的:如果元素是隐藏 ...

  6. jquery 中toggle的2种用法

    一.在元素的click事件中绑定两个或两个以上的函数  toggle不像bind需要在后面添加"click"来绑定click触发事件,toggle本身就是click触发的(而且只能 ...

  7. jQuery中val()、text()、html()之间的差别

    一.括号里没有值时表示取值    val获取表单中的值: text获取对象中的文本内容,不包含html标签: html获取对象中的内容,包括html标签 <!DOCTYPE HTML> & ...

  8. jQuery中 :first、:first-child 和 :first-of-type 之间的不同

    <!DOCTYPE html><html><head><meta charset="utf-8"><script src=&q ...

  9. 关于jQuery中toggle参数callback函数提前执行问题

    通过 jQuery,您可以使用 toggle() 方法来切换 hide() 和 show() 方法. 显示被隐藏的元素,并隐藏已显示的元素: $(selector).toggle(speed,call ...

随机推荐

  1. eclipse项目有红叉的解决办法

    eclipse项目上有红叉,说明这个项目存在一些的问题,对于这种情况需要具体来看. 1 新导入项目的红叉 如果是新导入的项目,一般红叉就只在项目名称上面有红叉,项目下的分项上面没有,这一般是由于当初项 ...

  2. hdfs创建删除文件和文件夹

    在 hadoop 中,基于 Linux 命令可以给 hdfs 创建文件和文件夹,或者删除文件和文件夹 创建文件的命令为: hadoop fs -touch /file.txt 创建文件夹的命令为: h ...

  3. Java 多线程(三)—— 线程的生命周期及方法

    这篇博客介绍线程的生命周期. 线程是一个动态执行的过程,它也有从创建到死亡的过程. 线程的几种状态 在 Thread 类中,有一个枚举内部类: 上面的信息以图片表示如下: 第一张图: 第二张图:把等待 ...

  4. 从.Net到Java学习第二篇——IDEA and start spring boot

    从.Net到Java学习第一篇——开篇 所谓工欲善其事,必先利其器,做java开发也一样,在比较了目前最流行的几个java IDE(eclipse,myeclipse.IDEA)之后,我果断选择IDE ...

  5. redis 系列22 复制Replication (下)

    一. 复制环境准备 1.1 主库环境(172.168.18.201) 环境 说明 操作系统版本 CentOS  7.4.1708  IP地址 172.168.18.201 网关Gateway 172. ...

  6. ReentrantLock原理学习

    上文我们学习了ReentrantLock的基本用法,在最后我们留下了一个问题,ReentrantLock获取的锁是什么锁呢?本文我们就从源码的角度来一探究竟.本文涉及到的源码对应JDK版本为1.8. ...

  7. PC逆向之代码还原技术,第二讲寻找程序入口点

    PC逆向之代码还原技术,第二讲寻找程序入口点 一丶简介 程序逆向的时候.我们需要知道程序入口点.动态分析的时候以便于看是什么程序编写的. 比如VC++6.0 我们可以写一个程序测试一下 我们写一段代码 ...

  8. RDIFramework.NET ━ .NET快速信息化系统开发框架 V3.2 新增解压缩工具类ZipHelper

    在项目对文件进行解压缩是非常常用的功能,对文件进行压缩存储或传输可以节省流量与空间.压缩文件的格式与方法都比较多,比较常用的国际标准是zip格式.压缩与解压缩的方法也很多,在.NET 2.0开始,在S ...

  9. curl 错误总结

    证书域名与访问的域名不一致 问题:curl SSL: certificate subject name 'luffichen_server.tencent.com' does not match ta ...

  10. Docker Compose 原理

    Docker 的优势非常明显,尤其是对于开发者来说,它提供了一种全新的软件发布机制.也就是说使用 docker 镜像作为软件产品的载体,使用 docker 容器提供独立的软件运行上下文环境,使用 do ...