将jquery窗口宽度转换为像素

时间:2016-12-17 20:59:15

标签: javascript jquery html5 canvas

我使用下面的代码来设置canvas元素的height和width属性。这些尺寸似乎不以像素形式返回。

(function(){
    var width = $(window).width(),
        height = $(window).height();
    canvas.width = width;
    canvas.height = height;
})()

有没有办法改变我可以检查这个值的单位或者在没有我的脚本转换的情况下获得等效的像素?

https://jsfiddle.net/gt38asfm/2/

2 个答案:

答案 0 :(得分:2)

Canvas标签本身并不需要单位。

第二件事;你没有"调整大小"事件触发,因此画布大小不会改变。

此外,您还限制了此行中活动区域的大小:

var x = Math.round(Math.random()*500), y = Math.round(Math.random()*500)

如果你想使用完整的画布区域绘制元素,你应该这样做:

var x = Math.round(Math.random()*width), y = Math.round(Math.random()*height)

变量宽度和高度不能在任何函数内部,否则您将出错(宽度未定义)。

干杯

答案 1 :(得分:0)

$(window).resize()对你好吗? https://jsfiddle.net/matake/gt38asfm/5/

$( window ).resize(function() {
    var width = $(window).width(),
    height = $(window).height();
    canvas.width = width;
    canvas.height = height;
    sizeSet = true;
});