js烟花特效

下面是编程之家 jb51.cc 通过网络收集整理的代码片段。

编程之家小编现在分享给大家，也给大家做个参考。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>JavaScript烟花丨Showcoo|秀客丨showcoo.net</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,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">
</style>
</head>
<body style="background:#000;font:12px Arial">
</body>
</html>
 
<font color="white"><p align="center">本特效由 <a href="http://www.showcoo.net">Showcoo|秀客</a>提供</p></font>

以上是编程之家(jb51.cc)为你收集整理的全部代码内容，希望文章能够帮你解决所遇到的程序开发问题。

如果觉得编程之家网站内容还不错，欢迎将编程之家网站推荐给程序员好友。

js烟花特效

猜你在找的HTML相关文章