1、区别

①动画效果的比较：

toggle：直接显示、隐藏，如果有【时间参数】且【匹配的元素有宽度属性】，则动态效果为左上角-右下角拉卷效果，透明度0-1之间的变化；若有时间参数但是【匹配的元素没有宽度属性】，则动态效果为上下拉卷的效果，且没有透明度的变化。

slideToggle：切换上下拉卷滚效果，竖向变换。

fadeToggle：切换效果为淡入、淡出，只与透明度相关。

②判断方式的比较：

toggle：判断方式为匹配元素的display属性

slideToggle：判断方式为匹配元素的height属性

fadeToggle：判断方式为匹配元素的opacity属性

2、共性

①三个方法动画结束后若匹配元素隐藏，则display值都会变成”none“，不再影响页面的布局

②若同时有多个匹配元素，则这些元素不会作为一个整体实现动画，而是异步完成动画效果（同时完成）

个人学习动画效果的一些心得，如有错误或见解不到之处还望指正！

jQuery中toggle与slideToggle以及fadeToggle的显示、隐藏方法的比较的更多相关文章

  1. jQuery中toggle与slideToggle以及fadeToggle之间的不同

    toggle()方法: 定义和用法 切换元素的可见状态.如果被选元素可见,则隐藏这些元素,如果被选元素隐藏,则显示这些元素. 语法: $(selector).toggle(speed,callback ...

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

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

  3. jQuery中设置form表单中action的值的方法

    下面介绍在jQuery中设置form表单中action的值的方法. $("#myFormId").attr("action", "userinfo.s ...

  4. (三)在js(jquery)中获得文本框焦点和失去焦点的方法

    在js(jquery)中获得文本框焦点和失去焦点的方法   文章介绍两个方法和种是利用javascript onFocus onBlur来判断焦点和失去焦点,加一种是利用jquery $(" ...

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

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

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

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

  7. Jquery 中toggle的用法举例

    toggle用法是使得两个以上的方法交替出现. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...

  8. 关于JQuery中的ajax请求或者post请求的回调方法中的操作执行或者变量修改没反映的问题

    前段时间做一个项目,而项目中所有的请求都要用jquery 中的ajax请求或者post请求,但是开始处理一些简单操作还好,但是自己写了一些验证就出现问题了,比如表单提交的时候,要验证帐号的唯一性,所以 ...

  9. jQuery中，子页面与父页面之间的调用方法

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

随机推荐

  1. mybatis批量修改数据

    xxxMapper.xml: <update id="updateSensorWarnings" parameterType="java.util.List&quo ...

  2. mvvm和mvc区别？

    mvc和mvvm其实区别并不大.都是一种设计思想.主要就是mvc中Controller演变成mvvm中的viewModel. mvvm主要解决了mvc中大量的DOM 操作使页面渲染性能降低,加载速度变 ...

  3. Java集合源码分析（四）——Vector

    简介 Vector 是矢量队列,它是JDK1.0版本添加的类.继承于AbstractList,实现了List, RandomAccess, Cloneable这些接口. 和ArrayList不同,Ve ...

  4. 从用SwiftUI搭建项目说起

    前言 后续这个SwiftUI分类的文章全部都是针对SwiftUI的日常学习和理解写的,自己利用Swift写的第二个项目也顺利上线后续的需求也不是特着急,最近正好有空就利用这段时间补一下自己对Swift ...

  5. Idea+Git+GitHub图文教程，一篇教程帮你搞定

    导语 该文章主要记录如何在GitHub上创建远程仓库.如何创建本地仓库并把代码提交到GitHub.如何创建分支以及分支合并到主干的操作. 一.在GitHub上创建远程仓库 (前提:已经注册过githu ...

  6. rancher安装，快速安装

    apt-get install docker.io docker -y docker run -d --restart=always -v /data/rancher_server:/var/lib/ ...

  7. Maven笔记之核心概念及常用命令

    Maven的核心概念 Maven是一款服务于java平台的自动化构建工具. 自动化构建工具还有:make->ant->maven->gradle       1.约定的目录  2.P ...

  8. [日常摸鱼]bzoj1218[HNOI2003]激光炸弹-二维前缀

    题意:二维网格一些格子有权值,求用边长为$r$的正方形能覆盖到格子权值和的最大值,格子大小$ \leq 5000$ 非常裸的二维前缀,然而 题目下标从0开始! QAQ 要是比赛就要爆零啦- #incl ...

  9. 深度学习炼丹术 —— Taoye不讲码德，又水文了，居然写感知器这么简单的内容

    手撕机器学习系列文章就暂时更新到此吧,目前已经完成了支持向量机SVM.决策树.KNN.贝叶斯.线性回归.Logistic回归,其他算法还请允许Taoye在这里先赊个账,后期有机会有时间再给大家补上. ...

  10. 【软件测试 Python自动化】全网最全大厂面试题，看完以后你就是面试官！

    前言 为了让大家更好的理解和学习投入到Python自动化来找到一份好的资料也是学习过程中,非常重要的一个点.你的检索能力越强,你就会越容易找到最合适你的资料. 有需要的小伙伴可以复制群号 313782 ...