JavaScript实现变化的满天星星

原创文章,转载请注明出处。star第一个参数为星星的宽高,第二个参数为周期时长。

 function star(maxw,time){
    let ele=[];
  setInterval(function updata(){
    for(let j=0;j<ele.length;j++){
    document.body.removeChild(ele[j]);
    }
    move();
  },time);
  function move(){
    let x=document.body.clientWidth-10; 
    let y=document.body.clientHeight-10; 
    for(let i=0;i<50;i++){
    let w=Math.random()*maxw+'px';
    let randomX=Math.random()*x+'px';
     let randomY=Math.random()*y+'px';

    ele[i]=document.createElement("div");
    ele[i].style.width=w;
    ele[i].style.height=w;
    ele[i].style.position='absolute';
    ele[i].style.top=randomY;
    ele[i].style.left=randomX;
    ele[i].style.background="#fff";
    ele[i].style.borderRadius='50%';

    document.body.appendChild(ele[i]);
     } 
  }  
 }
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值