一个烟花代码

编译器:HBuilder. 工作在忙也要回家聚聚

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta charset="utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>JavaScript烟花</title>
<script type="text/javascript">
var showcoo = function(){
 this.size = 40;
 this.speed = 0.1;
 this.rise();
}
showcoo.prototype = {
 color:function(){
  var c = ['0','3','6','9','c','f'];
  var t = [c[Math.floor(Math.random()*100)%6],'0','f'];
  t.sort(function(){return Math.random()>0.5?-1:1;});
  return '#'+t.join('');
 },
 aheight:function(){
  var h = document.documentElement.clientHeight;
  return Math.abs(Math.floor(Math.random()*h-200))+201;
 },
 firecracker:function(){
  var b = document.createElement('div');
  var w = document.body.clientWidth;
  b.style.color = this.color();
  b.style.position = 'absolute';
  b.style.bottom = 0;
  b.style.left = Math.floor(Math.random()*w)+1+'px';
  document.body.appendChild(b);
  return b;
 },
 rise:function(){
  var o = this.firecracker();
  var n = this.aheight();
  var speed = this.speed;
  var e = this.expl;
  var s = this.size;
  var k = n;
  var m = function(){
   o.style.bottom = parseFloat(o.style.bottom)+k*speed+'px';
   k-=k*speed;
   if(k<2){
    clearInterval(clear);
    e(o,n,s,speed);
   }
  }
  o.innerHTML = '*';
  if(parseInt(o.style.bottom)<n){
   var clear = setInterval(m,20);
  }
 },
 expl:function(o,n,s,speed){
  var R = n/3;
  var Ri = n/6;
  var r = 0;
  var ri = 0;
  for(var i=0;i<s;i++){
   var span = document.createElement('span');
   var p = document.createElement('p');
   span.style.position = 'absolute';
   span.style.left = 0;
   span.style.top = 0;
   span.innerHTML = '*';
   p.style.position = 'absolute';
   p.style.left = 0;
   p.style.top = 0;
   p.innerHTML = '+';
   o.appendChild(span);
   o.appendChild(p);
  }
  function spr(){
   r += R*speed;
   ri+= Ri*speed/2;
   sp = o.getElementsByTagName('span');
   p = o.getElementsByTagName('p');
   for(var i=0; i<sp.length;i++){
    sp[i].style.left=r*Math.cos(360/s*i)+'px';
    sp[i].style.top=r*Math.sin(360/s*i)+'px';
    p[i].style.left=ri*Math.cos(360/s*i)+'px';
    p[i].style.top=ri*Math.sin(360/s*i)+'px';
   }
   R-=R*speed;
   if(R<2){
    clearInterval(clearI);
    o.parentNode.removeChild(o);
   }
  }
  var clearI = setInterval(spr,20);
 }
}
window.onload = function(){
 function happyNewYear(){
  new showcoo();
 }
 setInterval(happyNewYear,400);
}
</script>
<style type="text/css">
	.aa
	{
		font: "微软雅黑";
		font-size: 30px;
		color: gold;
	    text-align: center;
		
	}
</style>
</head>
<body style="background:#000;font:12px Arial">
	<p class="aa">新年快乐</p>
	
	 <img src="img/qq.jpg"style="margin: 300px 0px 0px 560px;" />
	
	<audio src="audio/"></audio>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_43437385/article/details/87921772