今天做一个点击动画时,遇到了当快速连续点击时,动画效果会乱,并不是我们想要达到的效果。

  查询了一下,确认是动画累积的原因。网上搜了一下,发现jquery 的stop()函数刚好能解决。

stop(clearQueue,jumpToEnd)函数分析

仅仅从官方API上给出的说明,我们就知道,第一个参数是针对的其它动画队列(不包含当前动画),第二个参数则是当前动画。

那么,什么是动画队列呢?

所谓的动画队列就是一系列要执行的动画,比如对一个盒子先在前一秒执行挪动动画,再过一秒执行变大的动画。那么,这就是两个动画了。

再比如,点击某个按钮a,给盒子b触发动画效果,每次挪动10px,挪动10px需要的时间是2s,那么以很快的速度狂点这个a按钮,你在2s时间里点了10次,这个动画需要累积10次的。虽然我们2s里只能完成1个动画效果,但是剩下的9个动画还是要完成的,这就形成了动画累积,跟排队似的,若不做任何处理,将会逐个按照先来先动画的规则完成。

但现实中,这种动画累积并非是我们期望的结果。所以,我们需要对动画进行更多的操作。从stop的参数来看,对于动画的操作,分为当前动画等候动画队列,传入的参数为boolean值类型。

  • clearQueue,是否清除等候动画队列,默认false,即是不清除等候动画队列,设置为true,则清空等候动画队列。
  • jumpToEnd,是否立即完成当前动画,默认false,即是停止当前动画,设置为true,则立即完成当前动画。

没错,上面的例子确实可以验证stop函数的参数作用。

Jquery动画操作的stop()函数的更多相关文章

  1. js进阶 13-6 jquery动画效果相关常用函数有哪些

    js进阶 13-6 jquery动画效果相关常用函数有哪些 一.总结 一句话总结:animate(),stop(),finish(),delat()四个. 1.stop()方法的基本用法是什么(sto ...

  2. jQuery属性操作之.val()函数

    目录 .val()实例方法的三种用法 .val()函数源码 调用形式:$('xxx').val(); 调用形式:$('xxx').val(value); 调用形式:$('xxx').val(funct ...

  3. 【转载】jQuery动画中的queue()函数

    原文链接:http://www.cnblogs.com/hh54188/archive/2011/04/09/1996469.html 原文摘要:当你使用一系列的动画效果(如hide,show),这些 ...

  4. 解密jQuery内核 DOM操作的核心函数domManip

    domManip是什么 dom即Dom元素,Manip是Manipulate的缩写,连在一起就是Dom操作的意思. .domManip()是jQuery DOM操作的核心函数 对封装的节点操作做了参数 ...

  5. jQuery的一些基本的函数和用jQuery做一些动画操作

    jQuery是对js的封装,因为js有一些不方便的地方.所以,jQuery才会去对js进行封装. jQuery对于标签元素的获取 $('div')或$('li') <!DOCTYPE html& ...

  6. Jquery基础之动画操作

    Jquery的动画效果能够轻松的为网页添加动画效果,为网页带来了新的活力. 一.show()方法和hide()方法 show()方法和hide()方法是jquery中最基本的动画方法.使用show() ...

  7. jQuery动画高级用法(上)——详解animation中的.queue()动画队列插队函数

    决定对animate方面做一些总结,希望能给大家一些启发和帮助 从一个实际应用谈起 今天不谈animate().fadeIn().fadeOut().slideUp().show().hide()诸如 ...

  8. python全栈开发day48-jqurey自定义动画,jQuery属性操作,jQuery的文档操作,jQuery中的ajax

    一.昨日内容回顾 1.jQuery初识 1).使用jQuery而非JS的六大理由 2).jQuery对象和js对象转换 3).jQuery的两大特点 4).jQuery的入口函数三大写法 5).jQu ...

  9. jquery 动画总结(主要指效果函数)

    动画无非两类:帧动画frame和变形动画tween,以及3d动画.不论web还是安卓苹果app,动画原理都是这些. web app 动画实现的途径,无非这几种:1 gif动画---这就是帧动画,把若干 ...

随机推荐

  1. [转]快速入门系列--WebAPI--01基础

    本文转自:http://www.cnblogs.com/wanliwang01/p/aspnet_webapi_base01.html ASP.NET MVC和WebAPI已经是.NET Web部分的 ...

  2. DW2.0

    一.DW2.0从企业的角度,吸引企业的原因: 1.数据仓库基础设施的成本不再持续增长.在第一代数据仓库中,技术基础设施的成本是不断增长的,随着数据量的增长,基础设施的成本会以指数级增长.但是使用DW2 ...

  3. (3)-JSONObject的过滤设置

    我们通常对一个json串和java对象进行互转时,经常会有选择性的过滤掉一些属性值.例如下面的类:   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 ...

  4. iOS9 Https技术预研

    一.服务器需要做的事情: 1.要注意 App Transport Security 要求 TLS 1.2, 2.而且它要求站点使用支持forward secrecy协议的密码. 3.证书也要求是符合A ...

  5. rzdatetimepicker

    两项选为True时可显示今天和圆圈 此属性可使右边按钮下平滑 注意Format中的表示月份的MM一定要大写,不然修改时和分钟会联动.

  6. Android-GsonUtil工具类

    JSON解析封装相关工具类 public class GsonUtil { private static Gson gson = null; static { if (gson == null) { ...

  7. docker 版本变化及说明

    Docker从1.13.x版本开始,版本分为企业版EE和社区版CE,版本号也改为按照时间线来发布,比如17.03就是2017年3月,有点类似于ubuntu的版本发布方式. 企业版自然会提供一些额外的服 ...

  8. mysql 数据库或者表空间使用查询

    直接上语句 查所有数据库占用空间大小 select TABLE_SCHEMA, concat(truncate(sum(data_length)/1024/1024,2),' MB') as data ...

  9. Git 常用知识

    git 常用命令 创建并checkout分支: git checkout -b branch_name git merge 与 git rebase 的区别 git rebase 合并后将形成一条直线 ...

  10. Android 多图,大图内存优化

    策略: 1. 图片压缩 如果所需尺寸大于图片原始尺寸,可以压缩图片节省内存. 2. 图片缓存 每个图片加载时都会生成一个 Bitmap.把这些 Bitmap 缓存起来以重用相同的图片,避免重复创建. ...