jquery中stop停止动画笔记
jQuery stop() 方法用于停止动画或效果,在它们完成之前。
stop() 方法适用于所有 jQuery 效果函数,包括滑动、淡入淡出和自定义动画。
语法:
可选的 stopAll 参数规定是否应该清除动画队列。默认是 false,即仅停止活动的动画,允许任何排入队列的动画向后执行。
可选的 goToEnd 参数规定是否立即完成当前动画。默认是 false。
因此,默认地,stop() 会清除在被选元素上指定的当前动画。
其中
stop():表示的是停止当前正在进行的动画,但会执行之后还没进行的动画
stop(true):表示的是停止所有的动画,包括正在进行的和还没有进行的
stop(true,true):表示的是停止所有的动画,但会将当前正在进行的动画立刻完成
例子如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("#start").click(function(){
$("div").animate({left:'100px'},5000);
$("div").animate({fontSize:'3em'},5000);
}); $("#stop").click(function(){
$("div").stop();
}); $("#stop2").click(function(){
$("div").stop(true);
}); $("#stop3").click(function(){
$("div").stop(true,true);
}); });
</script>
</head>
<body> <button id="start">开始</button>
<button id="stop">停止</button>
<button id="stop2">停止所有</button>
<button id="stop3">停止动画,但完成动作</button>
<p>点击 "开始" 按钮开始动画。</p>
<p>点击 "停止" 按钮停止当前激活的动画,但之后我们能再动画队列中再次激活。</p>
<p>点击 "停止所有" 按钮停止当前动画,并清除动画队列,所以元素的所有动画都会停止。</p>
<p>点击 "停止动画,但完成动作" 快速完成动作,并停止它。</p> <div style="background:#98bf21;height:100px;width:200px;position:absolute;">HELLO</div> </body>
</html>
jquery中stop停止动画笔记的更多相关文章
- jQuery中的经典动画
show()方法和hide()方法是jQuery中的基本动画方法,hide()方法等于将css()方法设置display属性为none.如何让元素动起来呢,我们可以在show和hide里加入slow, ...
- jQuery中的渐变动画效果
jQuery中的渐变动画效果jQuery中的渐变动画效果
- bootstrap课程7 jquery中结束之前动画用什么
bootstrap课程7 jquery中结束之前动画用什么 一.总结 一句话总结:stop()方法.$('.navs').not($('.navs').eq(idx)).stop().hide(100 ...
- jQuery中事件与动画
jQuery中的事件与动画 一. jQuery中的事件 jQuery事件是对javaScript事件的封装. 1.基础事件 在javaScript中,常用的基础事件有鼠标事件.键盘事件.windo ...
- jQuery中事件与动画的总结
1.加载DOM 1.1.window事件 window.onload=function(){}.... 时机:其他资源都加载完毕后,再执行 $(function(){}) ……:只是 ...
- jQuery 中的简单动画
制作动画常用方法: show("速度") 显示元素 hide("速度") 隐藏元素 toggle() 切换效果 例如下jQuery代 ...
- jquery 中fadeIn,fadeOut动画
我们在做首页banner图片播放的时候会使用fadeIn,fadeOut动画,这里需要注意的是: fadeIn作用相当于:display:list-item;opcity逐渐变为1 fadeOut作用 ...
- jQuery中的综合动画
所谓综合动画,就是在链式表达式依次执行相关animate函数,其中的参数是以键值对的方式存在的. 如下示例,就展示了一个基本的综合动画. <!DOCTYPE html PUBLIC " ...
- jQuery中自定义简单动画的实现
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...
随机推荐
- freeswitch中集成使用ekho实现TTS功能一
Linux下安装freeswitch并集成ekho实现TTS 1. linux下安装freeswitch就不多介绍了,具体链接网址: http://www.8000hz.com/archives/14 ...
- cocos2dx打飞机项目笔记七:各种回调:定时器schedule、普通回调callFunc、菜单回调menu_selector、事件回调event_selector
各种回调函数的定义: typedef void (CCObject::*SEL_SCHEDULE)(float); typedef void (CCObject::*SEL_CallFunc)(); ...
- 斯坦福机器学习视频笔记 Week6 关于机器学习的建议 Advice for Applying Machine Learning
我们将学习如何系统地提升机器学习算法,告诉你学习算法何时做得不好,并描述如何'调试'你的学习算法和提高其性能的“最佳实践”.要优化机器学习算法,需要先了解可以在哪里做最大的改进. 我们将讨论如何理解具 ...
- Go Mysql驱动
Golang中MYSQL驱动 Mysql库https://github.com/go-sql-driver/mysql Go本身不提供具体数据库驱动,只提供驱动接口和管理. 各个数据库驱动需要第三方实 ...
- 让FireFox支持 window.event 全局事件对象
这里比原文稍加改进,让FF也支持 event.srcElement了, 省得每次写兼容代码挺麻烦的: //For firefox window.event if(typeof(window.event ...
- Linux 一键安装 webmin/virtualmin
Webmin是一个可运行于Linux/freebsd的web界面的主机管理系统,而Virtualmin是一个基于Webmin的虚拟主机管理模块. webmin官方站: http://www.webmi ...
- python进阶02
1.import导入模块 import sys sys.path:显示的是:从显示目录中查找要导入的模块文件. 程序执行时导入模块路径:sys.path.append('/home/itcast/xx ...
- RGB(16进制)_转_TColor
ZC:内存中 COLORREF就是一个DWORD(从定义"COLORREF = DWORD;"就可以看出来),但是 具体的byte R/G/B 的位置是怎么方式的? ZC:Wind ...
- Keystone集成LDAP
转自 http://wsfdl.com/openstack/2016/01/13/Keystone%E9%9B%86%E6%88%90LDAP.html 得益于 Keystone 优良的架构,它允许 ...
- review01
.java叫源文件,java编译器编译源文件后会产生字节码文件,java解释器将字节码文件加载进内存,java虚拟机来执行字节码文件. 如下列文件名为“String01.java” public cl ...