Home > Developer > Web Develop
JS fireworks special effects code that looks like 3D effects, and 3djs fireworks special effects code
<! 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>
<Title> fireworks Code </title>
</Head>
<Style type = "text/css">
. Fire {display: block; overflow: hidden; font-size: 12px; position: absolute };
Body {overflow: hidden; background: #000}
Html {overflow: hidden; background: #000}
</Style>
<Body>
<Div> <A href = "http://www.999jiujiu.com/"> http://www.999jiujiu.com/</A> </div>
</Body>
<Script type = "text/javascript">
Var Fire = function (r, color ){
This. radius = r | 12;
This. color = color | "FF6600 ";
This. xpos = 0;
This. ypos = 0;
This. zpos = 0;
This. vx = 0;
This. vy = 0;
This. vz = 0;
This. mass = 1;
This. p = document. createElement ("span ");
This. p. className = "fire ";
This. p. innerHTML = "*";
This. p. style. fontSize = this. radius + "px ";
This. p. style. color = "#" + this. color;
}
Fire. prototype = {
Append: function (parent ){
Parent. appendChild (this. p );
},
SetSize: function (scale ){
This. p. style. fontSize = this. radius * scale + "px ";
},
SetPosition: function (x, y ){
This. p. style. left = x + "px ";
This. p. style. top = y + "px ";
},
SetVisible: function (B ){
This. p. style. display = B? "Block": "none ";
}
}
Var fireworks = function (){
Var fires = new Array ();
Var count = 100;
Var fl = 250;
Var vpx = 500;
Var vpy = 300;
Var gravity =. 3;
Var floor = 200;
Var bounce =-. 8;
Var timer;
Return {
Init: function (){
For (var I = 0; I <count; I ++ ){
Var color = 0xFF0000;
Color = (Math. random () * 0 xFFFFFF). toString (16). toString (). split (".") [0];
While (color. length <6 ){
Color = "0" + color;
}
Var fire = new Fire (12, color );
Fires. push (fire );
Fire. ypos =-100;
Fire. vx = Math. random () * 6-3;
Fire. vy = Math. random () * 6-3;
Fire. vz = Math. random () * 6-3;
Fire. append (document. body );
}
Var that = this;
Timer = setInterval (function (){
For (var I = 0; I <count; I ++ ){
That. move (fires [I]);
}
}, 30 );
},
Move: function (fire ){
Fire. vy + = gravity;
Fire. xpos + = fire. vx;
Fire. ypos + = fire. vy;
Fire. zpos + = fire. vz;
If (fire. ypos> floor ){
Fire. ypos = floor;
Fire. vy * = bounce;
}
If (fire. zpos>-fl ){
Var scale = fl/(fl + fire. zpos );
Fire. setSize (scale );
Fire. setPosition (vpx + fire. xpos * scale,
Vpy + fire. ypos * scale );
Fire. setVisible (true );
} Else {
Fire. setVisible (false );
}
}
}
}
Fireworks (). init ();
</Script>
</Html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
