javascript - 如何使用 Cocos2D 制作 HTML5 Canvas 整页大小

Question

我是 Cocos2D-HTML5(和 HTML5 本身)的新手，我正在尝试让 Canvas 成为页面的完整大小。我对 Internet 上关于此问题的记录如此之少感到困惑，所以我希望它实际上非常简单。

问题是 <canvas>元素不接受 width="100%"或 height="100%" ，但只有像素(但它不会拉伸(stretch)以适合窗口)。

我也尝试过描述的解决方案 here (css 和 javascript)，但 Cocos2D 似乎调整 Canvas 大小以适应 width和 height尽管如此，如果省略属性，则使用默认大小 300 x 150 像素(如果没有 Cocos2D，我会得到整页 Canvas )。

如何更改 Canvas 大小以适合 Cocos2D 本身的页面？

Answer 1

source

HTML:

<canvas id="canvas"></canvas>

JavaScript:

var canvas = document.getElementById('canvas'),
context = canvas.getContext('2d');
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;

CSS:

* { margin:0; padding:0; } /* to remove the top and left whitespace */
html, body { width:100%; height:100%; } /* just to be sure these are full screen*/
canvas { display:block; } /* To remove the scrollbars */