粒子喷泉
注:来自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();