【code】animate综合动画

最新推荐文章于 2018-10-06 21:21:28 发布

季诗筱

最新推荐文章于 2018-10-06 21:21:28 发布

阅读量668

点赞数

分类专栏： jQuery 文章标签： jQuery javascript 动画

本文链接：https://blog.csdn.net/XIAOZHUXMEN/article/details/50238297

版权

jQuery 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>animate综合动画</title>
	<style type="text/css">
		*{margin:0;padding:0;}	
		body { padding: 60px }
		#panel {position: relative; width: 100px; height:100px;border: 1px solid #0050D0;background: #96E555; cursor: pointer}
</style>
</head>
<body>
	<div id="panel"></div>
<script type="text/javascript" src="../scripts/jquery.js"></script>
<script type="text/javascript">
	$(function() {
		$("#panel").css("opacity","0.5");
		$("#panel").click(function(){
			$(this).animate({left:"500px",height:"200px",opacity:"1"},3000)
				   .animate({top:"200px",width:"200px"},3000)
				   .fadeOut("slow");
		})
		
	})
</script>
</body>
</html>