动次打次，粘贴下来，保存成html（娱乐）

最新推荐文章于 2021-06-19 23:57:47 发布

@时间旅行者@

最新推荐文章于 2021-06-19 23:57:47 发布

阅读量162

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/qq_41844287/article/details/96448805

版权

前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script type="text/javascript" src="js/jquery-3.4.1.min.js" ></script>
		
	</head>
	<style>
		body{
			background: darkgray;
		}
		#all{
			width: 500px;
			height: 500px;
			background-color: red;
			border-radius: 250px;
			float: left;
		}
		#all2{
			width: 500px;
			height: 500px;
			background-color: red;
			border-radius: 250px;
			float: right;
		}
		
	</style>
	<body>
		<div id="all">
			
		</div>
		<div id="all2">
			
		</div>
		<script>
				var a=1;
				setTimeout(function(){
				fun(a+5);
				}, 1)	
			function fun(a){
				setTimeout(function(){
				$('#all').css("background","rgb("+a+",100,200)");
				$('#all').css("margin-top",a+"px");
				$('#all').css("margin-left",a+"px");
				$('#all').css("width",500-2*a+"px");
				$('#all').css("height",500-2*a+"px");
				$('#all').css("border-radius",500-a+"px");
				
				$('#all2').css("background","rgb("+a+",100,200)");
				$('#all2').css("margin-top",a+"px");
				$('#all2').css("margin-right",a+"px");
				$('#all2').css("width",500-2*a+"px");
				$('#all2').css("height",500-2*a+"px");
				$('#all2').css("border-radius",500-a+"px");
				if(a>250)a=1;
				fun(a+5);
				}, 1)
			}
		</script>
	</body>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

@时间旅行者@

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
动次打次，粘贴下来，保存成html（娱乐）

<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript" src="js/jquery-3.4.1.min.js" ></script> ...
复制链接

扫一扫