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

jQuery stop()用法

2017-10-25 19:53 288 查看
<style type="text/css">
div{
width: 100px;
height: 100px;
background: red;
}
</style>
</head>
<body>
<input type="button" id="input" value="按钮" />
<div></div>
</body>
<script src="js/jquery-1.12.4.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$('div').on('mouseover',function(){
$(this).animate({width:600,height:600},3000,function(){
$(this).animate({width:100,height:100},3000,function(){
});
});
});
/*
// 连续调用jQuery的方法但是只使用了一次选择器,这种方式叫做链式调用
$('.box').animate({width:300,height:300}, 3000)
.animate({width:50, height:50}, 3000);
*/
$('input').on('click',function(){
// 效果等同于stop(false, false)
//$('div').stop();

//第一个false 会将第一个动画立刻停止 播放下一个动画
//$('div').stop(false,false);

//立刻执行完第一个动画 再执行后面的
//$('div').stop(false,true);

//后面的动画会停止(清空了后续动画) 不会执行
//$('div').stop(true,false);

//瞬间执行完第一个动画 没有后续的动画执行
$('div').stop(true,true);
});
</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: