jQuery如何停止元素的animate动画,还有怎样判断是否处于动画状态
jquery的animation会自动进入队列,就出现了一个问题,这些动画会一一执行完成,而我们实际的本意是当鼠标移开的时候动画即终止。
停止元素的动画方法:stop()
语法结构:stop([clearQueue],[gotoEnd])
clearQueue 和 gotoEnd 都为可选参数,为布尔值。
clearQueue : 是否要清空未执行玩的动画列表
gotoEnd : 是否直接将正在执行的动画跳转到末状态
经常在hover时间的动画效果里用到 stop() 方法,可以避免动画效果与光标动作不一致时导致的延迟动画。
例如:
|
1
2
3
4
5
6
7
|
$(".test").hover(function(){ $(this).stop().animate({height:"150",width:"300"},200);},function(){ $(this).stop().animate({height:"50",width:"100"},3200);}); |
判断元素是否处于动画状态:
|
1
2
3
|
if(! $(elememt).is(":animated") ){ //判断元素是否处于动画状态 //如果当前没有进行动画,则添加} |
jQuery如何停止元素的animate动画,还有怎样判断是否处于动画状态的更多相关文章
- jQuery停止动画和判断是否处于动画状态
1.停止元素的动画 stop([clearQueue][,gotoEnd]); 参数clearQHCHC和gotoEnd都足町选的参数,为Boolean值(ture或flase).clearQueue ...
- 锋利的jQuery-4--停止动画和判断是否处于动画状态(防止动画加入队列过多的办法)
1.停止元素的动画:stop([cleanQueue, gotoEnd]):第一个参数代表是否要清空未执行完的动画队列,第二个参数代表是否直接将正在执行的动画跳转到末状态. 无参数stop():立即停 ...
- jQuery中关于如何使用animate自定义动画
动画 animate() 01.animate()方法的简单使用 有些复杂的动画通过之前学到的几个动画函数是不能够实现,这时候就是强大的animate方法了. 操作一个元素执行3秒的淡入动画,对比下一 ...
- jQuery animate方法开发极客标签Logo动画融合效果
在线演示 本地下载 jQuery的animate方法基础使用,演示如何生成一个jQuery animate方法开发极客标签Logo动画融合效果 相关代码录播:jQuery animate方法开发极客标 ...
- jQuery---jQ动画(普通,滑动,淡入淡出,自定义动画,停止动画),jQuery的事件,jQ事件的绑定/解绑,一次性事件,事件委托,事件冒泡,文档加载
jQuery---jQ动画(普通,滑动,淡入淡出,自定义动画,停止动画),jQuery的事件,jQ事件的绑定/解绑,一次性事件,事件委托,事件冒泡,文档加载 一丶jQuery动画 show,hide, ...
- 教你三种jQuery框架实现元素显示及隐藏动画方式
摘要:在jQuery框架中对元素对象进行显示和隐藏有三种方式,分别是"默认方式显示和隐藏"."滑动方式显示和隐藏"."淡入淡出显示和隐藏". ...
- WOW.js和animate.css让页面滚动时显示动画
官网:http://mynameismatthieu.com/WOW/ bootstrap CDN服务:http://www.bootcdn.cn/wow/ 1.wow.js 实现了在网页滚动时的动画 ...
- jquery学习笔记----元素筛选
1.eq() 筛选指定索引号的元素2.first() 筛选出第一个匹配的元素3.last() 筛选出最后一个匹配的元素4.hasClass() 检查匹配的元素是否含有指定的类5.filter() 筛 ...
- 使用jquery获取父元素或父节点的方法
今天面试题问到了,没答上,jq要继续学习啊 jquery获取父元素方法比较多,比如parent(),parents(),closest()这些都能帮你实现查找父元素或节点,下面我们来一一讲解: 先举个 ...
随机推荐
- mac OS X 从无法同步互联网时间想到的
最近在mac OS X 巨浪 :)上执行 ntpdate time.nist.gov 失败,提示 13 Jan 19:41:53 ntpdate[1374]: the NTP socket is in ...
- Servlet3.0注解@WebInitParam和@WebServlet
在以前的servlet中我们初始化一些参数都是配置在web.xml中的,自从servlet3.0之后给我们提供了注解@WebServlet和@WebInitParam,@WebServlet是用来配置 ...
- Java开发各层对象含义 PO,VO,DAO,BO,POJO
java的几种对象(PO,VO,DAO,BO,POJO)解释 一.PO:persistant object 持久对象,可以看成是与数据库中的表相映射的java对象.最简单的PO就是对应数据库中 ...
- 02_NoSQL数据库之Redis数据库:string类型和hash类型
Strings类型及操作 String是最简单的类型,一个key对应一个Value,String类型是二进制安全的.Redis的String可以包含任何数据,比如jpg图片或者序列化的对象. S ...
- Cocos2D中的纹理(textures)的解释
大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请告诉我,如果觉得不错请多多支持点赞.谢谢! hopy ;) 免责申明:本博客提供的所有翻译文章原稿均来自互联网,仅供学习交流 ...
- 在CSDN开通博客专栏后如何发布文章(图文)
今天打开电脑登上CSDN发现自己授予了专栏勋章,有必要了解如何在专栏发布文章. 很感谢已经有前辈给出了图文教程,此文章转载自博客:http://blog.csdn.net/upi2u/article/ ...
- Gradle 1.12 翻译——第十五章. 任务详述
有关其他已翻译的章节请关注Github上的项目:https://github.com/msdx/gradledoc/tree/1.12,或访问:http://gradledoc.qiniudn.com ...
- Chapter 2 User Authentication, Authorization, and Security(4):限制SA帐号的管理权限
原文出处:http://blog.csdn.net/dba_huangzj/article/details/38817915,专题目录:http://blog.csdn.net/dba_huangzj ...
- Linux多线程实践(7) --多线程排序对比
屏障 int pthread_barrier_init(pthread_barrier_t *restrict barrier, const pthread_barrierattr_t *restri ...
- Java进阶(二十五)Java连接mysql数据库(底层实现)
Java进阶(二十五)Java连接mysql数据库(底层实现) 前言 很长时间没有系统的使用java做项目了.现在需要使用java完成一个实验,其中涉及到java连接数据库.让自己来写,记忆中已无从搜 ...