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()这些都能帮你实现查找父元素或节点,下面我们来一一讲解: 先举个 ...
随机推荐
- 海量数据挖掘MMDS week6: MapReduce算法(进阶)
http://blog.csdn.net/pipisorry/article/details/49445519 海量数据挖掘Mining Massive Datasets(MMDs) -Jure Le ...
- iOS中 UITableViewRowAction tableViewcell编辑状态下的功能 UI技术分享
* tableView:editActionsForRowAtIndexPath: // 设置滑动删除时显示多个按钮 * UITableViewRowAction // 通过此类创建按钮 * 1. 我 ...
- Linux0.11 创建进程的过程分析--fork函数的使用
/* * linux/kernel/fork.c * * (C) 1991 Linus Torvalds */ /* 注意:signal.c和fork.c文件的编译选项内不能有vc变量优化选项/Og, ...
- Android 纵向跑马灯滚动效果
像淘宝和京东都会有跑马灯的效果,今天给大家贡献下以前项目的一个demo,各位看官,且看效果图. 我们先定义一个Bean文件,这个实体类文件主要包含标题,内容描述,以及还有跳转的链接. LampBean ...
- spring揭秘 读书笔记 六 bean的一生
我们知道,Spring容器具有对象的BeanDefinition来保存该对象实例化时需要的数据. 对象通过container.getBean()方法是才会初始化该对象. BeanFactory 我们知 ...
- css3学习之旅-css的基本语法(1)
后面就将要介绍css的全面语法: 1.css介绍 2.css基本语法 3.css高级语法 4.css派生选择器 5.css的id选择器 6.css类选择器 7.css属性选择器 !!!!!css介绍 ...
- H5学习之旅-H5的块标签的使用(9)
块元素的基本语法 1. Html块元素 ,块元素在开始时候通常以新行开始,比如h1,p,ul 2.内联元素,通常不会以新行开始,比如a,b,img 3.html的div元素,div也被称为块元素,其主 ...
- OpenCV特征点检测算法对比
识别算法概述: SIFT/SURF基于灰度图, 一.首先建立图像金字塔,形成三维的图像空间,通过Hessian矩阵获取每一层的局部极大值,然后进行在极值点周围26个点进行NMS,从而得到粗略的特征点, ...
- 《15个提高Google搜索的技巧》
为了得到更加「多元化」的搜索结果,虽然 Google 目前访问起来并不是那么方便,但是仍然有很多人把它作为常用搜索引擎在使用. 其实除了最简单的关键词搜索之外,搜索引擎还提供了很多精细化的搜索功能,如 ...
- 《java入门第一季》之面向对象(多态练习)
接下来经过一个例子,对多态问题加深印象: 猫狗案例. /* 多态练习:猫狗案例 */ class Animal { public void eat(){ System.out.println(&quo ...