使用js实现雪花效果
2014-01-13 03:32:05 -0800
HTML代码
<head> <script> function start(){ var array=new Array(); var canvas=document.getElementById("mycanvas"); var context=canvas.getContext("2d"); for(var i=0;i<50;i++){ var Showsnow=new showsnow(); array.push(Showsnow); } time=setInterval(function (){ context.clearRect(0,0,canvas.width,canvas.height); for(var i=0;i<array.length;i++){ array[i].move(); array[i].draw(context); } },500); } function showsnow(){ var y=parseInt(Math.random()*50)*10; var x=parseInt(Math.random()*80)*10; this.draw=function(context){ context.font="50px Calibri"; context.fillText("*",x,y); } this.move=function(){ y+=20; if(y>600){ y=0; } }} </script> </head> <body> <input type="button" value="start" onclick="start()" /> <br/> <canvas id="mycanvas" height="600px" width="600px" style="border: 3px solid blue"></canvas> </body>
演示
«Newer
Older»
Back to home
Subscribe
|
Register
|
Login
|
N