1、区别

①动画效果的比较:

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

slideToggle:切换上下拉卷滚效果,竖向变换。

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

②判断方式的比较:

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

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

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

2、共性

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

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

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

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

  1. 前端 javascript 实现文件下载的示例

    在 html5 中,a 标签新增了 download 属性,包含该属性的链接被点击时,浏览器会以下载文件方式下载 h......

  2. jQuery+css实现的点击图片放大缩小预览功能示例【图片预览 查看大图】

    本文实例讲述了jQuery+css实现的点击图片放大缩小预览功能。分享给大家供大家参考,具体如下:要求点击一张图片,......

  3. JavaScript如何操作css

    原本应该是由css进行控制html中的div的宽高和背景颜色,但是在下方使用了JavaScript进行重新调用了di......

  4. JavaScript 防盗链的原理以及破解方法

    背景前段日子 在自学做项目的时候发现 明明在项目中引用了线上存在的图片 但是在自己的项目中却怎么也显示出来查阅资料后......

  5. JavaScript实现浏览器网页自动滚动并点击的示例代码

    1. 打开浏览器控制台窗口JavaScript通常是作为开发Web页面的脚本语言,本文介绍的JavaScript代码......

  6. JavaScript中的Proxy对象

    Js中Proxy对象Proxy对象用于定义基本操作的自定义行为,例如属性查找、赋值、枚举、函数调用等。语法const......

  7. JavaScript Html实现移动端红包雨功能页面

    本文实例为大家分享了Html实现移动端红包雨功能页面的具体代码,供大家参考,具体内容如下实现效果如下:具体代码如下h......

  8. 如何使用 JavaScript 操作浏览器历史记录 API

    History 是 window 对象中的一个 JavaScript 对象,它包含了关于浏览器会话历史的详细信息。你......

  9. JavaScript—深入理解函数

    当程序在调用某个函数时,做了以下的工作:准备执行环境,初始函数作用域链和arguments参数对象。函数概述函数的声......

  10. JavaScript 如何禁止用户保存图片

    场景 在业务需求中不希望用户保存图片,因为是一些供内部使用的图片。 思路 添加事件禁止选择、拖拽、右键(简单的禁......

随机推荐

  1. python 窃取摄像头照片的实现示例

    python窃取摄像头照片源码+获取授权码方法+py打包成exe教你用python做一个属于自己的窃取摄像头照片的软......

  2. php中数组最简单的使用方法

    我们在说映射的时候,有些小伙伴就会联想到数组,没错,因为数组就是用了映射的思想。这里很多刚学php的小伙伴对概念不是......

  3. 手把手教你搭建SSH框架(Eclipse版)

    原文来自公众号【C you again】,若需下载完整源码,请在公众号后台回复“ssh”。本期文章详细讲解了SSH(......

  4. php的curl携带header请求头信息实现http访问的方法

    导读:curl请求时添加请求头信息可以模拟真人操作,不容易被当成是爬虫机器人(采集),从而可以绕过Incapsula......

  5. javascript中call,apply,bind的区别详解

    在JS中,这三者都是用来改变函数的this对象的指向的,他们有什么样的区别呢。在说区别之前还是先总结一下三者的相似之......

  6. C# 调用FFmpeg处理音视频的示例

    FFmpeg 开源、跨平台、体积小、功能强大,提供了录制、转换以及流化音视频的完整解决方案。官网:https:/......

  7. css3实现背景渐变

    #grad {background: -webkit-linear-gradient(left,rgba(255,0......

  8. C#处理医学图像(一):基于Hessian矩阵的血管肺纹理骨骼增强对比

    在医院实际环境中,经常遇到有问题的患者,对于一些特殊的场景,比如骨折,肺结节,心脑血管问题需要图像对比增强来更为清晰......

  9. Linux下最常用的10个文件压缩工具

    作者简介李先生(Lemon),高级运维工程师(自称),SRE专家(目标),梦想在35岁买一辆保时捷。喜欢钻研底层技术......

  10. C++ 入门篇

    C++基础入门 1 C++初识 1.1 第一个C++程序 编写一个C++程序总共分为4个步骤 创建项目 ......