html5 滚动小球

最新推荐文章于 2024-06-22 20:14:29 发布

weixin_30466953

最新推荐文章于 2024-06-22 20:14:29 发布

阅读量470

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/systemnet123/p/3424335.html

<html>
 <head>
  <meta charset="utf-8"/>
 </head>
 <body onkeydown="keydown()">
  <canvas id="tankmap" width="500px" height="300px" style="background-color:black"></canvas>
 </body>
</html>
<script>
   var arcx=30;
   var arcy=30;
   var canvas=document.getElementById("tankmap");
   canvas.width=window.screen.width;
   canvas.height=window.screen.height;
   var cxt= canvas.getContext("2d");
   drawball();
   function drawball(){
   cxt.beginPath();
   cxt.fillStyle="#BA9658"
   cxt.arc(arcx,arcy,10,0,360,true);
   cxt.closePath();
   cxt.fill();
   }

   function keydown(){
	   //alert(event.keyCode);
	   cxt.clearRect(0,0,window.screen.width,window.screen.height);
	   arcx++;
	   arcy++;
	   drawball();
   }
</script>

转载于:https://www.cnblogs.com/systemnet123/p/3424335.html