粒子喷泉

注：来自http://daimaren.cn/blog/?p=195
(function(){//粒子喷泉

var sp = function(posx,posy){

var c1=Math.floor(Math.random()*256),c2=Math.floor(Math.random()*256),c3=Math.floor(Math.random()*256);

this.posX = posx;

this.posY = posy;

this.velX = 0;

this.velY = 0;

this.shrink = 1;

this.size = 1;

this.drag = 1;

this.gravity = 0;

this.alpha = 0.5;

this.fade = 0;

this.update = function()

{

this.velX *= this.drag;

this.velY *= this.drag;

this.velY += this.gravity;

this.posX += this.velX;

this.posY += this.velY;

this.size *= this.shrink;

this.alpha -= this.fade;

}



this.render = function(c)

{

c.fillStyle = "rgba("+c1+","+c2+","+c3+","+this.alpha+")";

c.beginPath();

c.arc(this.posX, this.posY, this.size, 0, Math.PI*2, true);

c.closePath();

c.fill();

}

}

var spring = window['spring'] = function(){

var W = window.innerWidth,H=window.innerHeight,springArr=[],MaxSpring=150,context,_self=this;

this.printScr = function(){

document.write('<canvas width='+W+' height='+H+' id="Myspring"></canvas>')

};

this.randomRange = function(min,max){//返回随机范围值

return ((Math.random()*(max-min)) + min);

};

this.isCanDraw = function(){

return !!document.createElement('canvas').getContext;

};

this.makeSpring = function(nub){

for(var i=0;i<nub;i++){

var sps = new sp(_self.randomRange(1,W),100);

sps.velX = (Math.random()*20)-10;

sps.velY = (Math.random()*20)-10;

sps.drag = 0.96;

sps.gravity = 0.5;

sps.size = _self.randomRange(1,20);

springArr.push(sps);

}

};

this.init=function(){

if(_self.isCanDraw()){

_self.printScr();

var canvas = document.getElementById("Myspring");

context = canvas.getContext('2d');

_self.loop();

}

}

this.loop = function(){

_self.makeSpring(4);

context.fillStyle="rgb(0,0,0)";

context.fillRect(0,0,W, H);

for (i=0; i<springArr.length; i++)

{

var sp =springArr[i];

sp.render(context);

sp.update();



}

while(springArr.length>MaxSpring){

springArr.shift();

}
setTimeout(_self.loop,1000/30)
}

}

})();
var po = new spring();
po.init();