Posted in Javascript onAugust 26, 2013
今天用html5绘布加js写的雪花飘效果 。分享下:
<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> </html>
使用js实现雪花飘落效果
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@