您的位置：首页 > Web前端 > JQuery

【JQuery】stop()函数

2016-04-02 23:59 465 查看

作用是停止动画效果，但是这里面的学问非常大。

格式是：

stop([stopAll], [gotoEnd])

两个参数都是布尔值，要么true要么false，且第二个参数是在设置了第一个参数之后才起作用的。

接下来就是重头戏了。

以下是我根据实验得出的，和很多文档上写的有出入，但是实验结论是这样的，希望有人反驳我。

1、无论第一个参数是false还是true，如果第二个参数是false，那么动画就停在当前状态。

2、无论第一个参数是false还是true，如果第二个参数是true，那么动画会首先直接跳到当前动画的末尾，然后再继续执行后面的动画。

3、如果只有一个参数或者没有参数，那么动画就停在当前状态。

例子。

<body>
<h3>调用stop()方法停止当前所有动画效果</h3>
<span></span>
<input id="btnStop" type="button" value="停止" />
<div id="tip"></div>

<script type="text/javascript">
$(function () {
$("span").animate({
left: "+=100px"
}, 3000, function () {
$(this).animate({
height: '+=60px',
width: '+=60px'
}, 3000, function () {
$(this).animate({left:'+=100px'},3000,function(){$("#tip").html("执行完成!");})
});
});

$("#btnStop").bind("click", function () {
$("span").stop(false,true);
$("#tip").html("执行停止!");
});
});
</script>
</body>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航