我正在尝试使用JavaScript居中动态html 5画布窗口。我知道我目前的代码不起作用,但我想知道是否有一种方法来实现margin-left: auto/margin-left: auto技术,通常可以在html页面内居中元素。我还尝试了使用我的canvas类CSS进行此操作,但也没有起作用,因此非常感谢任何帮助。谢谢。
我的代码:
var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");
document.getElementById("canvas").style.marginLeft = "auto";
document.getElementById("canvas").style.marginRight = "auto";
canvas.width = 300;
canvas.height = 300;
drawScreen();
formElement = document.getElementById("height");
formElement.addEventListener('change', heightChanged, true);
formElement = document.getElementById("width");
formElement.addEventListener('change', widthChanged, false);
function widthChanged(e) {
var target = e.target;
canvas.width = target.value;
drawScreen();
}
function heightChanged(e) {
var target = e.target;
canvas.height = target.value;
drawScreen();
}
function drawScreen() {
}