jq 动画的影响

如果不清除   jq 动画 left值被修改为0后的一瞬间后   恢复原来的   left值 继续执行之前没执行完的动画

<!DOCTYPE html>
<html lang="zh">

	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<title>Document</title>
		<style type="text/css">
			#a {
				width: 100px;
				height: 100px;
				position: absolute;
				left: 100px;
				top: 100px;
				background: red;
			}
		</style>
	</head>
	<body>
		<button id="btn2">下一</button>
		<div id="a"></div>
	</body>
	<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
	<script type="text/javascript">
		$("#btn2").click(function() {
			if($("#a")[0].offsetLeft >= 200) {
				$("#a").stop(true,true)
				$("#a").css("left", 0);
				
			}
			$("#a").animate({
				width: "+=20",
				height: "+=20",
				left: "+=20"
			}, 500);console.log($("#a")[0].offsetLeft)
		})
	</script>

</html>

猜你喜欢

转载自blog.csdn.net/a17634399794/article/details/82468871
jq