stop()函数直接停止动画,finish()也会停止动画同时所有排队的动画的CSS属性跳转到他们的最终值。

示例代码:

<html>

    <head>
<meta charset="UTF-8" />
<title>jQuery停止动画finish和stop函数区别</title>
<style type="text/css">
div {
border: 1px solid green;
width: 200px;
height: 200px;
line-height: 200px;
text-align: center;
}
</style>
<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js "></script>
</head> <body>
<button type="button" id="start">start</button>
<button type="button" id="start">stop</button>
<button type="button" id="finish">finish</button>
<div class="">
动画
</div>
<script type="text/javascript">
$(document).ready(function() {
$("#start").click(function() {
$("div").animate({
width: '1800px'
}, 3000);
}); $("#stop").click(function() {
//停止当前正在运行的动画, width: '+=100px'可以停止
//停止当前正在运行的动画 width: '1800px'不能停止
$("div").stop();
});
$("#finish").click(function() {
//停止当前正在运行的动画 width: '+=100px'可以停止
//停止当前正在运行的动画 width: '1800px'可以停止,并且停止在最后一帧
$("div").finish();
});
});
</script>
</body> </html>

说明:

示例中stop()函数没有停止动画,为什么

jQuery停止动画finish和stop函数区别的更多相关文章

  1. jQuery 停止动画、jQuery Callback 函数、jQuery - Chaining

    一.jQuery 停止动画 jQuery stop() 方法用于在动画或效果完成前对它们进行停止. stop() 方法适用于所有 jQuery 效果函数,包括滑动.淡入淡出和自定义动画. $(sele ...

  2. jQuery 停止动画

    jQuery stop() 方法用于在动画或效果完成前对它们进行停止. 停止滑动 点击这里,向上/向下滑动面板 实例 jQuery stop() 滑动演示 jQuery stop() 方法. jQue ...

  3. jquery 停止动画 stop的几种用法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. jQuery停止动画——stop()方法的使用

    很多时候需要停止匹配元素正在进行的动画,比如,当鼠标选入元素时显示菜单,鼠标离开时隐藏下拉菜单,如果鼠标移入移出过快的话就会导致动画效果与鼠标的动作不一致的情况,此时stop()就派上用场了. sto ...

  5. jQuery停止动画和判断是否处于动画状态

    1.停止元素的动画 stop([clearQueue][,gotoEnd]); 参数clearQHCHC和gotoEnd都足町选的参数,为Boolean值(ture或flase).clearQueue ...

  6. Jquery停止动画

    stop方法 第一个参数:是否清除动画队列 true | false 第二个参数:是否跳转到动画最终效果   true | false 使用stop()方法的技巧 当下拉菜单和手风琴产生动画队列的问题 ...

  7. jQuery 学习02——效果:隐藏/显示、淡入淡出、滑动、动画、停止动画、Callback、链

    jQuery 效果- 隐藏hide()和显示show() 语法: $(selector).hide(speed,callback);$(selector).show(speed,callback); ...

  8. jQuery 效果 - 停止动画

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

  9. jQuery animate()动画效果

    1.jQuery动画效果 jQuery animate()方法用于创建自定义动画 $(selector).animate({params},speed,callback); //必需的 params ...

随机推荐

  1. oracle 存储过程循环体中的return和exit区别:

    oracle 存储过程循环体中的return和exit区别:   (1) return 跳出整个循环,终止该循环, 后面的不再执行.     相当于 Java 中的break;   (2)  exit ...

  2. buffer and cache -systemtap

    http://blog.csdn.net/dianhuiren/article/details/7543886

  3. objective-c block 详解 转

    Block   Apple 在C, Objective-C, C++加上Block這個延申用法.目前只有Mac 10.6 和iOS 4有支援.Block是由一堆可執行的程式組成,也可以稱做沒有名字的F ...

  4. 使用命名参数处理 CallableStatement

    简介:JDBC 中的语句处理 在 JDBC 应用程序中,JDBC 语句对象用于将 SQL 语句发送到数据库服务器.一个语句对象与一个连接相关联,应用程序与数据库服务器之间的通信由语句对象来处理. JD ...

  5. IOS tableview 横向滚动

    1. UITableView 设置 CGRect tableViewRect = CGRectMake(0.0, 0.0, 50.0, 320.0);self.tableView = [[UITabl ...

  6. MICS:副本和纠删码混合存储系统

    摘要 云存储系统的三个指标: 高可靠性,低存储开销,高读写性能. 这三个指标是没有办法同一时候满足的,许多时候须要进行tradeoff. 副本系统和纠删码是两种在存储系统中广泛使用的策略,它们在保证高 ...

  7. otl翻译(11) -- OTL的迭代器

    OTL stream read iterator 这个类是一个像传统的JDBC中的getter()操作一样扩展了OTL流的模板类.它现在还不支持UNICODE字符集.它对otl_refcur_stre ...

  8. Mysql数据库事务及隔离级别学习测试

    参考了这篇文章的一些内容: http://xm-king.iteye.com/blog/770721 记住以下这张表: 我在springdemo库里面建了一个表: CREATE TABLE `tx` ...

  9. go语言基础之指针做函数参数

    1.指针做函数参数 示例: package main //必须有个main包 import "fmt" func swap(a, b int) { a, b = b, a fmt. ...

  10. 什么是ScaleIO中的forwards rebuild和backwards rebuild?

    Forward rebuild发生在磁盘或节点挂掉的时候. 这种rebuild的过程的load是均衡到protection domain中所有可用的磁盘和节点上的. 这种rebuild相对于backw ...