画布的HTML属性(宽度,高度)会独立更改

时间:2016-10-31 05:11:24

标签: javascript html css firefox canvas

我在JS上有一些脚本,它改变了canvas元素的宽度和高度:

 function RefreshSizes (canvas) {
        var temp_width = 320;
        var temp_height = 240;

        document.getElementById(canvas).setAttribute('width', temp_width);
        document.getElementById(canvas).setAttribute('height', temp_height);
    }

此函数在画布初始化后立即调用。 它在Chrome上运行良好。

但是在FireFox 49中我看到了:

enter image description here

它可能是什么?

UPD#1 BukkitmanPlays MCPE的测试代码 enter image description here

UPD#2 画布的完整CSS:

    element {
        width: 320px;
        height: 240px;
    }
    .canvas {
        border: 3px solid #E0E0E0;
        z-index: 0;
        position: relative;
    }
    html {
        font: 10px/10px arial;
    }

1 个答案:

答案 0 :(得分:3)

一个浏览器上的某些代码在另一个浏览器上是不一样的,所以在这种情况下,我会做什么:

function RefreshSizes (canv) {
    var temp_width = 320;
    var temp_height = 240;

    var canvas = canv;
    canvas.width = temp_width;
    canvas.height = temp_height;
}

我确定这会起作用