源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

使用js实现雪花飘落效果

  • 时间:2021-07-25 04:00 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:使用js实现雪花飘落效果
今天用html5绘布加js写的雪花飘效果 。分享下: [img]http://files.jb51.net/file_images/article/201308/20130826090804.png[/img] < STRONG>
[u]复制代码[/u] 代码如下:
<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>
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部