JavaScript烟花效果

一个很简单的烟花代码
JavaScript代码
  1. radius =0;
  2. last_radius=100;
  3. startY=200;
  4. c_count=0;
  5. deviatY=1;
  6. // 设定礼花颜色
  7. Colors=new Array('ff0000','00ff00','ffffff','ff00ff','ffa500','ffff00','00ff00','ffffff','ff00ff');
  8. sColors=new Array('ffa500','00ff00','FFAAFF','fff000','fffffF');
  9. color=sColors[Math.floor(Math.random()*sColors.length)];
  10. if(document.all){
  11.     last_radius=document.body.clientWidth/8;
  12.     startX=document.body.clientWidth/2;
  13.     staY= document.body.clientHeight-20;
  14. }else{last_radius=window.outerWidth/8;
  15.     startX=window.outerWidth/2;
  16.     staY= window.outerHeight-20;
  17. }
  18. for(i=0;i
  19.     document.write("+color+";top:"+staY+";left:"+startX+";'ID='bon"+i+"'>*
");
  • }
  • // 设定礼花升起时间
  • setTimeout("uchiage()",10)
  • function uchiage(){
  •     if(startY < staY){
  •         staY-=10;
  •         for(i=0;i
  •             if(document.all){
  •                 document.all["bon"+i].style.pixelTop = staY+document.body.scrollTop;
  •             }else{
  •                 document.getElementById("bon"+i).style.top=staY+window.pageYOffset +"px";
  •             }
  •         }
  •         setTimeout("uchiage()",50);
  •     }else{
  •         radius =20;hanabi();
  •     }
  • }
  • function hanabi(){
  •     if(last_radius > radius){
  •         radius +=10;
  •         for(i=0;i
  •             pointX = startX + Math.cos(i)*radius;
  •             (deviatY == 0.3)?katamuki=(pointX - startX) * 0.4:katamuki=0;
  •             pointY = startY + Math.sin(i)*radius*deviatY+katamuki;
  •             if(document.all){
  •                 document.all["bon"+i].style.pixelTop = pointY+document.body.scrollTop;
  •                 document.all["bon"+i].style.pixelLeft = pointX;
  •             }else{
  •                 document.getElementById("bon"+i).style.top=pointY+window.pageYOffset +"px";
  •                 document.getElementById("bon"+i).style.left=pointX+"px";
  •             }
  •         }
  •         // 设定礼花张开时间
  •         setTimeout("hanabi()",60);
  •     }else if(c_count<300){
  •         for(i=0;i
  •             color=Colors[Math.floor(Math.random()*Colors.length)];
  •             if(document.all){
  •                 document.all["bon"+i].style.backgroundColor = color;
  •             }else{
  •                 document.getElementById("bon"+i).style.backgroundColor = color;
  •             }
  •             c_count++
  •         }
  •         // 设定礼花持续时间
  •         setTimeout("hanabi()",50);
  •     }else{
  •         color=sColors[Math.floor(Math.random()*sColors.length)];
  •         radius = 20;c_count=0;
  •         if(document.all){
  •             scrX=document.body.clientWidth - last_radius*2;
  •             startX=Math.floor(Math.random()*scrX)+last_radius;
  •             startY=Math.random()*last_radius+last_radius;
  •             staY= document.body.clientHeight-20;
  •             (!(Math.floor(Math.random()*3)))?deviatY=0.3:deviatY=1;
  •             for(i=0;i
  •                 document.all["bon"+i].style.backgroundColor = color;
  •                 document.all["bon"+i].style.pixelTop = staY+document.body.scrollTop;
  •                 document.all["bon"+i].style.pixelLeft = startX;
  •             }
  •         }else{
  •             scrX=window.outerWidth-last_radius*2;
  •             startX=Math.floor(Math.random()*scrX)+last_radius;
  •             startY=Math.random()*last_radius+last_radius;
  •             staY= window.outerHeight-20;
  •             (!(Math.floor(Math.random()*3)))?deviatY=0.3:deviatY=1;
  •             for(i=0;i
  •                 document.getElementById("bon"+i).style.backgroundColor = color;
  •                 document.getElementById("bon"+i).style.top=staY+window.pageYOffset +"px";
  •                 document.getElementById("bon"+i).style.left=startX+"px";
  •             }
  •         }
  •         uchiage();
  •     }
  • }
  • function hanabi_size(){
  •     if(document.all){
  •         last_radius=document.body.clientWidth/8;
  •     }else{
  •         last_radius=window.outerWidth/8;
  •     }
  • }
  • document.body.οnresize=hanabi_size;
  • 将上面代码放入HTML的body中即可,如下
    1. <html>
    2. <body bgcolor="black">
    3. <SCRIPT type="text/javascript">
    4. SCRIPT>
    5. body>
    6. html>



    转贴请注明出处: http://blog.csdn.net/froole

    你可能感兴趣的:(灌水,软件开发——柴米油盐酱醋茶)