JavaScript烟花效果

一个很简单的烟花代码

JavaScript代码

2. radius =0;
3. last_radius=100;
4. startY=200;
5. c_count=0;
6. deviatY=1;
7. // 设定礼花颜色
8. Colors=new Array('ff0000','00ff00','ffffff','ff00ff','ffa500','ffff00','00ff00','ffffff','ff00ff');
9. sColors=new Array('ffa500','00ff00','FFAAFF','fff000','fffffF');
10. color=sColors[Math.floor(Math.random()*sColors.length)];
12. if(document.all){
13.     last_radius=document.body.clientWidth/8;
14.     startX=document.body.clientWidth/2;
15.     staY= document.body.clientHeight-20;
16. }else{last_radius=window.outerWidth/8;
17.     startX=window.outerWidth/2;
18.     staY= window.outerHeight-20;
19. }
20. for(i=0;i<Math.PI*2;i=i+0.3){
21.     document.write("<DIV STYLE='position:absolute;font-size:5;background-color:"+color+";top:"+staY+";left:"+startX+";'ID='bon"+i+"'>*</DIV>");
22. }
24. // 设定礼花升起时间
25. setTimeout("uchiage()",10)
27. function uchiage(){
28.     if(startY < staY){
29.         staY-=10;
30.         for(i=0;i<Math.PI*2;i=i+0.3){
31.             if(document.all){
32.                 document.all["bon"+i].style.pixelTop = staY+document.body.scrollTop;
33.             }else{
34.                 document.getElementById("bon"+i).style.top=staY+window.pageYOffset +"px";
35.             }
36.         }
37.         setTimeout("uchiage()",50);
38.     }else{
39.         radius =20;hanabi();
40.     }
41. }
43. function hanabi(){
44.     if(last_radius > radius){
45.         radius +=10;
46.         for(i=0;i<Math.PI*2;i=i+0.3){
47.             pointX = startX + Math.cos(i)*radius;
48.             (deviatY == 0.3)?katamuki=(pointX - startX) * 0.4:katamuki=0;
49.             pointY = startY + Math.sin(i)*radius*deviatY+katamuki;
50.             if(document.all){
51.                 document.all["bon"+i].style.pixelTop = pointY+document.body.scrollTop;
52.                 document.all["bon"+i].style.pixelLeft = pointX;
53.             }else{
54.                 document.getElementById("bon"+i).style.top=pointY+window.pageYOffset +"px";
55.                 document.getElementById("bon"+i).style.left=pointX+"px";
56.             }
57.         }
58.         // 设定礼花张开时间
59.         setTimeout("hanabi()",60);
60.     }else if(c_count<300){
61.         for(i=0;i<Math.PI*2;i=i+0.3){
62.             color=Colors[Math.floor(Math.random()*Colors.length)];
63.             if(document.all){
64.                 document.all["bon"+i].style.backgroundColor = color;
65.             }else{
66.                 document.getElementById("bon"+i).style.backgroundColor = color;
67.             }
68.             c_count++
69.         }
70.         // 设定礼花持续时间
71.         setTimeout("hanabi()",50);
72.     }else{
73.         color=sColors[Math.floor(Math.random()*sColors.length)];
74.         radius = 20;c_count=0;
75.         if(document.all){
76.             scrX=document.body.clientWidth - last_radius*2;
77.             startX=Math.floor(Math.random()*scrX)+last_radius;
78.             startY=Math.random()*last_radius+last_radius;
79.             staY= document.body.clientHeight-20;
80.             (!(Math.floor(Math.random()*3)))?deviatY=0.3:deviatY=1;
81.             for(i=0;i<Math.PI*2;i=i+0.3){
82.                 document.all["bon"+i].style.backgroundColor = color;
83.                 document.all["bon"+i].style.pixelTop = staY+document.body.scrollTop;
84.                 document.all["bon"+i].style.pixelLeft = startX;
85.             }
86.         }else{
87.             scrX=window.outerWidth-last_radius*2;
88.             startX=Math.floor(Math.random()*scrX)+last_radius;
89.             startY=Math.random()*last_radius+last_radius;
90.             staY= window.outerHeight-20;
91.             (!(Math.floor(Math.random()*3)))?deviatY=0.3:deviatY=1;
92.             for(i=0;i<Math.PI*2;i=i+0.3){
93.                 document.getElementById("bon"+i).style.backgroundColor = color;
94.                 document.getElementById("bon"+i).style.top=staY+window.pageYOffset +"px";
95.                 document.getElementById("bon"+i).style.left=startX+"px";
96.             }
97.         }
98.         uchiage();
99.     }
100. }
101. function hanabi_size(){
102.     if(document.all){
103.         last_radius=document.body.clientWidth/8;
104.     }else{
105.         last_radius=window.outerWidth/8;
106.     }
107. }
108. document.body.onresize=hanabi_size;

将上面代码放入HTML的body中即可，如下

1. <html>
2. <body bgcolor="black">
3. <SCRIPT type="text/javascript">
4. <!--放入烟花的JavaScript代码-->
5. </SCRIPT>
6. </body>
7. </html>

<script type="text/javascript"><!--google_ad_client = "pub-2097865745512830";/* 728x90, 作成済み 08/12/22 */google_ad_slot = "5461334436";google_ad_width = 728;google_ad_height = 90;//--></script><script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
转贴请注明出处：http://blog.csdn.net/froole