使用JavaScript写的一个旋转的彩圈代码,JS代码库,德仔网

代码语言

代码分类

【JS】使用JavaScript写的一个旋转的彩圈

作者:Alex / 发布于2015/6/25/ 551


	<!DOCTYPE html>
	<html>
	<head>
	<script src="//C:/Users/wif/Desktop/jquery-1.11.3.min.js"></script>
	<script>
	for(var i=0;i<100000;i++)
	{
	if(i%4==0)
	setTimeout("$('#div1').css({'border-left':'40px solid red','border-bottom':'40px solid green','border-right':'40px solid yellow','border-top':'40px solid blue'})",2000*i);
	if(i%4==1)
	setTimeout("$('#div1').css({'border-left':'40px solid blue','border-bottom':'40px solid red','border-right':'40px solid green','border-top':'40px solid yellow'})",2000*i);
	if(i%4==2)
	setTimeout("$('#div1').css({'border-left':'40px solid yellow','border-bottom':'40px solid blue','border-right':'40px solid red','border-top':'40px solid green'})",2000*i);
	if(i%4==3)
	setTimeout("$('#div1').css({'border-left':'40px solid green','border-bottom':'40px solid yellow','border-right':'40px solid blue','border-top':'40px solid red'})",2000*i);
	}
	
	</script>
	<style>
	
	#div2{
	width: 100px;
	 height: 100px;
	 border-left: 40px solid red;
	 border-right: 40px solid yellow;
	 border-bottom: 40px solid green;
	 border-top:40px solid blue;
	 background-color:#FFFFFF;
	 border-radius:900px/900px;
	 display:none;
	 top:0px;
	 left:0px;
	 position:relative;
	 z-index:1;
	}
	#div1{
	 width: 100px;
	 height: 100px;
	 border-left: 40px solid red;
	 border-right: 40px solid yellow;
	 border-bottom: 40px solid green;
	 border-top:40px solid blue;
	 background-color:#FFFFFF;
	 border-radius:90px/90px;
	}
	</style>
	</head>
	
	<body>
	<p style="color:#FF0000">&ETH;&yacute;&times;&ordf;&micro;&Auml;&Egrave;&brvbar;
	<div id="div1"></div>
	</body>
	</html>

评论列表

本站所提供的代码，版权归原作者所有，若有侵犯作者版权，请与我们联系，我们将立即删除或修改。谢谢!
本站所有代码发布及提供者。

试试其它关键字

　彩圈　

同语言下

可能有用的

Alex贡献的其它代码(27)