jQuery自定义动画

左心房为你撑大大i 提交于 2020-01-11 01:37:17

```bash
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			div{
				width: 100px;
				height: 100px;
				background-color: #FFA500;
			}
		</style>
	</head>
	<body>
		<div></div><br>
		<button type="button" class="start">按钮</button> <button type="button" class="stop">停止</button>
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function(){
				$(".start").on("click",function(){
					$("div")
					.animate({"width":"200px"})
					.animate({"height":"200px"})
					.animate({"left":"80px"},500)
					.animate({"width":"100px"},700)
					.animate({"height":"100px"},700)
					.animate({"left":"0px"},700,function(){
						alert("执行完毕");
					})
				})
				$(".stop").on("click",function(){
					$("div").stop(true)
				})
			})
		</script>
	</body>
</html>

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!