jQuery stop() 方法用于停止动画或效果,在它们完成之前。

stop() 方法适用于所有 jQuery 效果函数,包括滑动、淡入淡出和自定义动画。

语法:

$(selector).stop(stopAll,goToEnd);

可选的 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停止动画笔记的更多相关文章

  1. jQuery中的经典动画

    show()方法和hide()方法是jQuery中的基本动画方法,hide()方法等于将css()方法设置display属性为none.如何让元素动起来呢,我们可以在show和hide里加入slow, ...

  2. jQuery中的渐变动画效果

    jQuery中的渐变动画效果jQuery中的渐变动画效果

  3. bootstrap课程7 jquery中结束之前动画用什么

    bootstrap课程7 jquery中结束之前动画用什么 一.总结 一句话总结:stop()方法.$('.navs').not($('.navs').eq(idx)).stop().hide(100 ...

  4. jQuery中事件与动画

    jQuery中的事件与动画   一. jQuery中的事件 jQuery事件是对javaScript事件的封装. 1.基础事件 在javaScript中,常用的基础事件有鼠标事件.键盘事件.windo ...

  5. jQuery中事件与动画的总结

       1.加载DOM     1.1.window事件 window.onload=function(){}.... 时机:其他资源都加载完毕后,再执行   $(function(){}) ……:只是 ...

  6. jQuery 中的简单动画

    制作动画常用方法: show("速度")   显示元素   hide("速度")   隐藏元素   toggle()       切换效果 例如下jQuery代 ...

  7. jquery 中fadeIn,fadeOut动画

    我们在做首页banner图片播放的时候会使用fadeIn,fadeOut动画,这里需要注意的是: fadeIn作用相当于:display:list-item;opcity逐渐变为1 fadeOut作用 ...

  8. jQuery中的综合动画

    所谓综合动画,就是在链式表达式依次执行相关animate函数,其中的参数是以键值对的方式存在的. 如下示例,就展示了一个基本的综合动画. <!DOCTYPE html PUBLIC " ...

  9. jQuery中自定义简单动画的实现

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

随机推荐

  1. freeswitch中集成使用ekho实现TTS功能一

    Linux下安装freeswitch并集成ekho实现TTS 1. linux下安装freeswitch就不多介绍了,具体链接网址: http://www.8000hz.com/archives/14 ...

  2. cocos2dx打飞机项目笔记七:各种回调:定时器schedule、普通回调callFunc、菜单回调menu_selector、事件回调event_selector

    各种回调函数的定义: typedef void (CCObject::*SEL_SCHEDULE)(float); typedef void (CCObject::*SEL_CallFunc)(); ...

  3. 斯坦福机器学习视频笔记 Week6 关于机器学习的建议 Advice for Applying Machine Learning

    我们将学习如何系统地提升机器学习算法,告诉你学习算法何时做得不好,并描述如何'调试'你的学习算法和提高其性能的“最佳实践”.要优化机器学习算法,需要先了解可以在哪里做最大的改进. 我们将讨论如何理解具 ...

  4. Go Mysql驱动

    Golang中MYSQL驱动 Mysql库https://github.com/go-sql-driver/mysql Go本身不提供具体数据库驱动,只提供驱动接口和管理. 各个数据库驱动需要第三方实 ...

  5. 让FireFox支持 window.event 全局事件对象

    这里比原文稍加改进,让FF也支持 event.srcElement了, 省得每次写兼容代码挺麻烦的: //For firefox window.event if(typeof(window.event ...

  6. Linux 一键安装 webmin/virtualmin

    Webmin是一个可运行于Linux/freebsd的web界面的主机管理系统,而Virtualmin是一个基于Webmin的虚拟主机管理模块. webmin官方站: http://www.webmi ...

  7. python进阶02

    1.import导入模块 import sys sys.path:显示的是:从显示目录中查找要导入的模块文件. 程序执行时导入模块路径:sys.path.append('/home/itcast/xx ...

  8. RGB(16进制)_转_TColor

    ZC:内存中 COLORREF就是一个DWORD(从定义"COLORREF = DWORD;"就可以看出来),但是 具体的byte R/G/B 的位置是怎么方式的? ZC:Wind ...

  9. Keystone集成LDAP

    转自 http://wsfdl.com/openstack/2016/01/13/Keystone%E9%9B%86%E6%88%90LDAP.html 得益于 Keystone 优良的架构,它允许 ...

  10. review01

    .java叫源文件,java编译器编译源文件后会产生字节码文件,java解释器将字节码文件加载进内存,java虚拟机来执行字节码文件. 如下列文件名为“String01.java” public cl ...