javascript设置canvas宽高_H5之家 - 中国HTML5教程资源分享第一站

canvas教程

javascript设置canvas宽高

字号+ 作者：H5之家来源：H5之家 2017-06-23 08:00 我要评论( )

javascript设置canvas宽高,加密错误代码记录:eyBbIjEyMjkiXT17IFsi0qrJvrP9tcTOxLz+wdCx7SJdPXsgWzFdPSJGRGF0YVxccmVnaXN0X3NjZW5lLmRhdCIgfSxbIrj80MLLtcP3Il09

环境：win7 32位,ie11

转自：

画布Canvas自适应浏览器窗口调整宽高

让画布自适应浏览器窗口调整宽高可以利用window对象的onresize事件属性，当浏览器窗口发生大小调整时会触发此事件。注意在css样式中应当清除外边距和内边距的浏览器默认样式，同时将canvas的display属性设置为“block”。
此方法的目的是为了在调整浏览器窗口的时候页面不出现滚动条，在利用画布进行游戏开发的场合很常用。

<!DOCTYPE html> <body> <canvas id="a" width=300 height=300></canvas> <style> *{ margin: 0; padding: 0; } #a{ display: block; background-color: gray; } </style> <script> var canvas=document.getElementById("a"); window.onresize=resizeCanvas; function resizeCanvas(){ canvas.width=window.innerWidth; canvas.height=window.innerHeight; } resizeCanvas(); </script> </body>