首页 > 解决方案 > dom css在javascript中不起作用

问题描述

我想从 javascript 更改画布左边距,因为我想使用变量。但不知何故,代码不起作用。这是我的代码

var upbicanvas = document.getElementById("upbi");
var upbictx = upbicanvas.getContext("2d");

var upbiimage = new Image();

upbiimage.onload = function () {
    console.log("Loading Top Image...");
    upbictx.drawImage(upbiimage, 1400, 0, 2500, 2600, 0, 0, upbicanvas.width, upbicanvas.height);
}

upbiimage.src = "images/BI.jpg";
var w = screen.width;
var h = screen.height / 15;
var uph = screen.height / 2;
var mleft = -1 * (w / 45);
var uppercanvas = document.getElementById("upperbi");

uppercanvas.height = h;
uppercanvas.width = w;
uppercanvas.style.marginLeft = mleft;
upbicanvas.width = w;

uppercanvas.style.marginLeft 部分不起作用。任何人都知道出了什么问题以及如何解决?

对不起,如果我的英语不好..

标签: javascript

解决方案


您需要明确指定要表示的单位mleft

而不是uppercanvas.style.marginLeft = mleft您正在寻找:

uppercanvas.style.marginLeft = mleft + "px"

这可以在下面看到:

var w = screen.width;
var h = screen.height / 15;
var uph = screen.height / 2;
var mleft = -1 * (w / 45);

var uppercanvas = document.getElementById("upperbi");
uppercanvas.style.marginLeft = mleft + "px";
<div id="upperbi">Test</div>


推荐阅读