jQuery动画具有按序列执行的特点，即第一个动画执行完会继续执行后续动画，好多时候，我们都需要停止当前动画，或立即执行完当前动画，这时，就需要用到jQuery提供到的stop（）方法。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div {
width: 100px;
height: 100px;
background-color: skyblue;
}
</style>
<script src="../jquery-1.11.3.min.js"></script>
<script>
$(function () {
$("button").eq(0).click(function () {
// stop（false） 停止当前动画，后续队列中的动画继续执行 （默认值）
// stop（true） 停止当前动画，并清空后续队列中的所有动画
// 第二个参数默认值也为false
// stop（false，true） 当前动画立即执行完毕，后续队列中的动画继续执行
// stop（true,true） 当前动画立即执行完毕，并清空后续队列中的所有动画
$("div").animate({"height": "300"}, 2000);
$("div").animate({"width": "300"}, 2000);
$("div").animate({"height": "100"}, 2000);
$("div").animate({"width": "100"}, 2000);
})
$("button").eq(1).click(function () {
$("div").stop(true,true);
})
})
</script>
</head>
<body>
<button>开始</button>
<button>停止</button>
<div></div>
</body>
</html>
大家可以根据具体情况，选择采用哪种参数来实现自己想要的效果
