8-12 canvas专题-阶段练习一(上)
8-12 canvas专题-阶段练习一(上)
1 <!DOCTYPE html> 2 <html lang="zh-cn"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>8-12 课堂演示</title> 6 </head> 7 <style type="text/css"> 8 9 </style> 10 <body> 11 <canvas id="canvas" width="800" height="600" style="background: #A9A9A9"> 12 很抱歉,您的浏览器暂不支持HTML5的canvas 13 </canvas> 14 <script> 15 var c=document.getElementById("canvas"); 16 var ctx=c.getContext("2d"); 17 ctx.lineWidth=5; 18 ctx.strokeStyle="orange"; 19 ctx.fillStyle="red"; 20 var i=0; 21 function rotRect(){ 22 i++ 23 ctx.save() 24 ctx.clearRect(0,0,c.width,c.height) 25 ctx.translate(c.width/2,c.height/2); 26 ctx.rotate(i*15*Math.PI/180) 27 ctx.strokeRect(0,0,100,100) 28 ctx.fillRect(0,0,100,100) 29 ctx.restore() 30 } 31 32 setInterval('rotRect()',500) 33 </script> 34 </body> 35 </html>
版权申明:欢迎转载,但请注明出处
一些博文中有一些参考内容因时间久远找不到来源了没有注明,如果侵权请联系我删除。
在校每年国奖、专业第一,加拿大留学,先后工作于华东师范大学和香港教育大学。
2024-09-05:27岁,宅加太忙,特此在网上找女朋友,vx:fan404006308
AI交流资料群:753014672