神码ai伪原创文章生成器软件【php源码】

最新推荐文章于 2025-07-17 14:38:53 发布

chatgpt002

最新推荐文章于 2025-07-17 14:38:53 发布

阅读量151

点赞数

CC 4.0 BY-SA版权

文章标签： python

本文链接：https://blog.youkuaiyun.com/chatgpt002/article/details/132231927

本文介绍了如何使用Python结合HTML、CSS和JavaScript在网页上创建动态星星效果，通过Math.random()生成随机坐标实现星星的随机闪烁。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这篇文章主要介绍了用python绘制满天星动态，具有一定借鉴价值，需要的朋友可以参考下。希望大家阅读完这篇文章后大有收获，下面让小编带着大家一起了解一下。

火车头采集ai伪原创插件截图：

今天给大家实现一个让星星动起来的效果，其中Math.random()是返回一个Double类型的0到1的随机数，例如Math.random()*450就是把产生的数乘以450，0*450=0，1*450=450，也就是说变成了成0到450产生随机数，parseInt(Math.random()*450)就是从1到450产生随机数然后取整数部分。实现星星随机闪动的效果，主要利用星星x坐轴与y坐轴的随机，代码如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style>
			#dv{
				width: 500px;
				height: 500px;
				background-color:#000;
				
				}
				#dv b{
					font-size: 40px;
					color: aqua;
					position: relative;
				}
		</style>
		<>
			window.onload=function(){
				var js;
				document.getElementById("start").onclick=function(){
				  js=setInterval(function(){
				  	var x=parseInt(Math.random()*450);
				  	var y=parseInt(Math.random()*450);
				  	var x1=parseInt(Math.random()*400);
				  	var y1=parseInt(Math.random()*400);
				  	var x2=parseInt(Math.random()*300);
				  	var y2=parseInt(Math.random()*300);
				  	var x3=parseInt(Math.random()*200);
				  	var y3=parseInt(Math.random()*200);
				    var bobj=document.getElementById("dv").getElementsByTagName("b")[0];
				        bobj.style.left=x+"px";
				        bobj.style.top=y+"px";
				    var bobj2=document.getElementById("dv").getElementsByTagName("b")[1];
				        bobj2.style.left=x1+"px";
				        bobj2.style.top=y1+"px";
				    var bobj3=document.getElementById("dv").getElementsByTagName("b")[2];
				        bobj3.style.left=x2+"px";
				        bobj3.style.top=y2+"px"; 
				    var bobj4=document.getElementById("dv").getElementsByTagName("b")[3];
				        bobj4.style.left=x3+"px";
				        bobj4.style.top=y3+"px";
				  },800)
				 
				}
				 
			
		}	
			
		</>
	</head>
	<body>
		<input type="button" name="" value="亮起来" id="start" />
	   
	    <div id="dv">
	    	<b>☆</b>
	    	<b>☆</b>
	    	<b>☆</b>
	    	<b>☆</b>
	    </div>
	    
	
	</body>
</html>

其效果图如下：