0

我有一个画布网页，它可以正常工作，但有时在启动时大小不正确。说我已经声明了一个这样的canvas html标签：

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

我已经包含了一个 javascript 文件，该文件负责使用 jquery 进行大小调整

$(function() {
    var canvas = $('canvas')[0];

    var DISPLAY_WIDTH = window.innerWidth-10,
        DISPLAY_HEIGHT = 620,

有时在页面加载后，画布大小会被压缩到一个非常小的区域，并且所有渲染的对象都相互堆叠，如果我刷新但是这个问题不再存在。我使用了检查元素工具，发现当尺寸问题发生时，我有 html 代码

<canvas id="main_canvas" width="-10" height="620"></canvas>

似乎由于某种未知原因window.innerwidth未获得，宽度仅设置为 -10 并导致问题。但是 jquery 声明$(function(){})应该只在页面加载后执行，我认为我不能window.innerWidth只在 html 标记中使用。而且我不想将宽度设置为其他数值，因为这个问题也可能再次发生，我只是将这个数字宽度作为我的画布宽度。

无论如何可以告诉我一些修复？谢谢

4

1 回答 1

0

如果你把它全部放在

$(document).ready(function()

功能？引用：

它里面的所有东西都会在 DOM 被加载并且页面内容被加载之前加载。（来源： http: //www.learningjquery.com/2006/09/introducing-document-ready）

于 2012-07-25T06:28:33.197 回答