转载: http://www.cnblogs.com/yuejin/archive/2012/12/18/2822595.html

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动画连续触发、滞后反复执行解决办法

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

  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. NOIp #2009

    http://files.cnblogs.com/files/radiumlrb/NOIP2009%E6%8F%90%E9%AB%98%E7%BB%84%E5%A4%8D%E8%B5%9B%E8%AF ...

  2. EL函数以及自定义标签的应用

    一.EL函数(调用普通类的静态方法) 编写步骤(自定义EL函数的编写步骤即自定义标签的编写步骤): ①编写一个普通的java类,提供一个静态方法,功能自定,例如下: package cn.wzbril ...

  3. ZeroMQ接口函数之 :zmq_disconnect - 断开一个socket的连接

    ZeroMQ 官方地址 :http://api.zeromq.org/4-0:zmq_disconnect zmq_disconnect(3) ØMQ Manual - ØMQ/3.2.5 Name ...

  4. ZeroMQ接口函数之 :zmq_msg_recv - 从一个socket中接受一个消息帧

    ZeroMQ 官方地址 :http://api.zeromq.org/4-2:zmq_msg_recv zmq_msg_recv(3) ØMQ Manual - ØMQ/3.2.5 Name zmq_ ...

  5. About_Web

    成功网站的三要诀:内容.设计.营销 内容为王: 高质量的内容会促使网站走向成功.首先,用户有需求,他们需要被感动,被娱乐,被有料的内容和产品所吸引.漂亮的背景和亮骚的特效可能会有所助益,但终究只是辅助 ...

  6. javaScript代码执行顺序

    javaScript是一种描述型脚本语言,由浏览器进行动态的解析和执行. 页面加载过程中,浏览器会对页面上载入的每个js代码块进行扫描. JavaScript是一段一段的分析执行的,在分析执行同一段代 ...

  7. windows下virtualbox安装Ubuntu虚拟机

    安装Ubuntu的部分省略.下面是设置文件夹共享. 1. 安装virtualBox增强功能包 点击"设备"->"安装增强功能" 2. 在windows下建 ...

  8. 利用JS生成01010101……长度可控的序列

    function ab(d){ var a = []; var x = 1 ; for (var i = 0; i < d; i++) { if (x == 0) { x = x + 1; } ...

  9. Android Unable to instantiate activity: Didn't find class on path

    Android Unable to instantiate activity: Didn't find class on path After i spend a while on this prob ...

  10. How to only capute sub-matched character by grep

    File content: <a href="ceph-0.80.9-82.1.x86_64.rpm"><img src="/icons/rpm.gif ...