JQuery动画队列问题
在上网的时候经常会发现一些网站上发现一些bug,如导航菜单的动画队列问题(在同一个元素上执行多个动画,那么对于这个动画来说,后面的动画
会被放到动画队列中,等前面的动画执行完成了才会执行)
要解决问题需要停止动画 stop(clearQueue, jumpToEnd)
参数clearQueue 是否清除队列
参数jumpToEnd 是否跳转到最终效果
代码实现:
$(function () {
$("#btnStart").click(function () {
$("div").slideDown(1000).slideUp(1000);
});
$("#btnEnd").click(function () {
//clearQueue第一个参数:是否清除队列
//jumpToEnd第二个参数:是否跳转到最终效果
$("div").stop(true,true);
});
});
<body>
<input type="button" value="开始" id="btnStart"/>
<input type="button" value="停止" id="btnEnd"/>
<div></div>
</body>

JQuery动画队列问题的更多相关文章
- 深入学习jQuery动画队列
前面的话 队列实现是jQuery非常棒的一个拓展,使用动画队列可以使动画更容易实现.本文将详细介绍jQuery动画队列 queue() queue()方法用来显示在匹配的元素上的已经执行的函数队列 q ...
- jQuery 动画效果 与 动画队列
基础效果 .hide([duration ] [,easing ] [,complete ]) 用于隐藏元素,没有参数的时候等同于直接设置 display 属性 $('.target').hide() ...
- jQuery源码分析系列(39) : 动画队列
data函数在jQuery中只有短短的300行代码,非常不起点 ,剖析源码的时候你会发现jQuery只要在有需要保存数据的地方无时无刻不依赖这个基础设施 动画会调用队列,队列会调用data数据接口还保 ...
- jquery 清除动画队列不疑惑
$(this).siblings().stop().fadeTo(200, 0.3); jquery动画存在一个队列, 会把事件产生的动画 放在一个队列中,当来不及执行这些事件队列的时候,会在事件结束 ...
- jQuery的动画队列
动画队列主要用到jQuery的queue.dequeue和clearqueue. 1.queue()函数主要是将一个动画函数数组绑定到一个队列上 2.dequeue()函数主要是执行队列的第一个函数, ...
- jQuery动画高级用法(上)——详解animation中的.queue()动画队列插队函数
决定对animate方面做一些总结,希望能给大家一些启发和帮助 从一个实际应用谈起 今天不谈animate().fadeIn().fadeOut().slideUp().show().hide()诸如 ...
- Jquery自定义动画与动画队列
animate:自定义动画 $(selector).animate({params},[speed],[easing],[callback]); params:要执行动画的css属性,它是一个对象可以 ...
- jQuery动画的实现
没有引入deferred机制,其余流程都有了 //////////// //创建动画缓动对象 // //////////// function Tween(value, prop, animation ...
- 深入学习jQuery动画控制
× 目录 [1]动画状态 [2]停止动画 [3]动画延迟[4]全局控制 前面的话 jQuery动画可以使用fade.hide.slide等方法实现基本动画效果,可以使用animate实现自定义动画,甚 ...
随机推荐
- [No0000AA]Windows 系统环境变量列表
环境变量 详细信息 %ALLUSERSPROFILE% 所有用户 Profile 文件位置 %APPDATA% 应用程序数据的默认存放位置 %CD% 当前目录 %CLIENTNAME% 联接到终端服务 ...
- [LeetCode] Longest Palindrome 最长回文串
Given a string which consists of lowercase or uppercase letters, find the length of the longest pali ...
- [LeetCode] Flatten 2D Vector 压平二维向量
Implement an iterator to flatten a 2d vector. For example,Given 2d vector = [ [1,2], [3], [4,5,6] ] ...
- css3圣诞雪景球
本来想多做几个了 无奈最近太忙 于是模仿做了一个在codepen看到的圣诞雪景球 算是送给自己的圣诞礼物 演示地址:http://www.qdfuns.com/notes/26668/d5e177 ...
- 高介分类:核方法与支持向量机(SVM)
数据模型:并不是简单地二维数据,多个维度或者对象的数据聚合起来 { persion1's attr1:value1,...,persion1's attrN:va ...
- Not Hello World
通常对于一门语言的学习,一般都是以"Hello,World!"开始的.但对于汇编语言的学习,输出这句话并不容易,首先得了解寄存器等硬件知识. 汇编语言要得以运行,首先要讲源文件编译 ...
- [转]extjs grid的Ext.grid.CheckboxSelectionModel默认选中解决方法
原文地址:http://379548695.iteye.com/blog/1167234 grid的复选框定义如下: var sm = new Ext.grid.CheckboxSelection ...
- 【BZOJ 4581】【Usaco2016 Open】Field Reduction
http://www.lydsy.com/JudgeOnline/problem.php?id=4581 考虑\(O(n^3)\)暴力. 实际上枚举最靠边的三个点就可以了,最多有12个点. 还是暴力= ...
- [转]别再抱怨了,国内这么多优秀的Android资源你都知道吗?
因为一些大家都知道的原因,android很多官方出品的优秀开发资源在国内无法访问. 国内的同行们对此也做出了很多努力,有很多朋友通过各种手段把很多优秀的资源搬运到了国内,为国内android开发者提供 ...
- 通过维基API实现维基百科查询功能
通过英文维基的免费API,可以实现对维基百科的搜索查询或者标题全文查询等,尝试了一下通过title实现全文查询,返回的结果是wikitext格式,暂时不知道该如何应用,所以仅实现了查询功能,可以返回最 ...