7.HTML5 高级Canvas技术-基本动画
<body> <script> var canvas; var context; window.onload=function(){ canvas=document.getElementById("drawingCanvas"); context=canvas.getContext("2d"); drawFrame(); }; var squareX=0; var squareY=0; function drawFrame(){ context.clearRect(0, 0, canvas.width, canvas.height); context.beginPath(); context.rect(squareX,squareY,20,20); context.lineStyle="black"; context.lineWidth=1; context.fillStyle="red"; context.fill(); context.stroke(); squareX++; squareY++; setTimeout("drawFrame()",20); } </script> <canvas></canvas> </body>
猜你在找