jQuery中slideUp 、slideDown、animate等动画运用时,如果目标元素是被外部事件驱动, 当鼠标快速地连续触发外部元素事件, 动画会滞后的反复执行,其表现不雅。

则解决办法:

1、在触发元素上的事件设置为延迟处理, 即可避免滞后反复执行的问题(使用setTimeout)

2、在触发元素的事件时预先停止所有的动画,再执行相应的动画事件(使用stop)

jquery stop:

//语法结构    
$("#div").stop();//停止当前动画,继续下一个动画 
$("#div").stop(true);//清除元素的所有动画       
$("#div").stop(false, true);//让当前动画直接到达末状态 ,继续下一个动画
$("#div").stop(true, true);//清除元素的所有动画,让当前动画直接到达末状态

本人一般推荐使用第二种方法 

$("#div").stop().animate({width:"100px"},100); 

jQuery动画连续触发、滞后反复执行解决办法的更多相关文章

  1. 【转载】jQuery动画连续触发、滞后反复执行解决办法

    转载: http://www.cnblogs.com/yuejin/archive/2012/12/18/2822595.html jQuery中slideUp .slideDown.animate等 ...

  2. MyEclipse的JQuery.min.js报错红叉解决办法

    MyEclipse的JQuery.min.js报错红叉解决办法 1.选中报错的jquery文件"jquery-1.2.6.min.js".2.右键选择 MyEclipse--> ...

  3. 关于jQuery中,animate、slide、fade等动画的连续触发、滞后反复执行的bug的个人解决办法

    照例,现在开头讲个这个问题发生的背景吧: 因为最近要做个操作选项的呼出,然后就想到了用默认隐藏,鼠标划过的时候显示的方法. 刚开始打算添加一个class="active",直接触发 ...

  4. jQuery事件委托之Safari失效的解决办法--摘抄

    什么是事件委托 事件委托是Jquery中一种事件绑定的方式,不同于常见的事件绑定方式将事件绑定在目标元素上,而是将事件绑定在父级元素上通过事件冒泡来执行绑定函数. //常见的事件绑定(Jquery) ...

  5. 使用clearInterval清除计时循环时,最后一次循环还是会执行解决办法

    原代码: var interv=setInterval(function(){ alert("setInterval执行"); },2000) clearInterval(inte ...

  6. SVN cleanup操作反复失败解决办法

    今天在更新项目的时候遇到一个问题,按惯例要cleanup才能重新更新.但是很不幸,在cleanup的时候又遇到了问题! 1    svn cleanup failed–previous operati ...

  7. 最新版jQuery v3.3.1的BUG以及解决办法(什么问题不重要,怎么解决问题才重要)

    发现问题 最新版的 FineUIPro v5.2.0 中,我们将内置的 jQuery v1.12.4 升级到 jQuery v3.3.1 ,可以看升级记录: +升级到jQuery v3.3.1.    ...

  8. input输入框file类型第二次不触发onchange事件的解决办法,简单有效

    在网上看了很多办法,现在将网上大部分说法总结如下: 网上说法: 原因:选择一次后onchange事件没有绑定到input标签上:    解决办法:拷贝一份input标签的副本,每次选择后对原input ...

  9. layui动态添加的元素click等事件触发不了的解决办法

    在页面加载完成时候 '.add_project' 元素是可以触发click时间的,当动态添加 '.add_project' 时候,新添加的元素却触发不了click事件,类似下面的写法: $(" ...

随机推荐

  1. application、viewstate、纯HTML提交方式

    Application - 全局公共变量组 存放位置:服务端 所有的访问用户都是访问的同一个变量 声明周期:永久 用法同session类似 viewstate-病例 因为http的无状态性,需要记录上 ...

  2. 利用Object.prototype.toString方法,实现比typeof更准确的type校验

    Object.prototype.toString方法返回对象的类型字符串,因此可以用来判断一个值的类型. 调用方法: Object.prototype.toString.call(value) 不同 ...

  3. /proc 【虚拟文件系统】

    在安装新硬件到 Linux 系统之前,你会想要知道当前系统的资源配置状况. Linux 将这类信息全集中在 /proc 文件系统下./proc 目录下的文件都是 Linux 内核虚拟出来的,当你读取它 ...

  4. Linux json解析jq

    jq是一个linux下很方便的json解析器,平时看json文件都是一行混在一起的,非常不适合阅读. https://stedolan.github.io/jq/download/ 直接到官网上下载, ...

  5. debug 断点无效

    如果出现这样的情况 需要在debug下配置 配置好之后,断点测试即可,亲测有效.

  6. PHP data

  7. drupal字段值的规律

    field_abc,则会出现field_data_field_abc这样一个表,然后有entity_id这个字段,然后有field_abc_value或者field_abc_target_id,或者f ...

  8. hdu acm 简单暴力1004

    字符串匹配函数strcmp 直接使用来判断两字符串是否完全相等 用数组存每个单词的个数时  初始化为零就错 初始化为一时就正确  也不知道为什么

  9. AndroidStudio NDK配置使用以及错误集合

    Error:Execution failed for task ':app:transformNative_libsWithStripDebugSymbolForDebug'. > java.l ...

  10. pyhon——进程线程、与协程基础概述

    一直以来写博客都是实用主义者,只写用法,没信心写原理,但是每一次写作业的过程都有一种掘地三尺的感觉,终于,写博客困难症重症患者经历了漫长的思想斗争,还是决定把从网上淘到的各种杂货和自己的总结放在一起, ...