Javascript 画布 offsetTop 和 offsetLeft

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/7821962/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 03:44:14  来源:igfitidea点击:

Canvas offsetTop and offsetLeft

javascripthtml

提问by Stacker

In HTML5 Canvas what is offsetTop and offsetLeft ?

在 HTML5 Canvas 中 offsetTop 和 offsetLeft 是什么?

I'm trying to get the X and Y of a a mouse click event. I know I can get that through:

我正在尝试获取鼠标单击事件的 X 和 Y。我知道我可以通过:

mycanvas.onclick = function (evt) {
    var offX = evt.layerX - mycanvas.offsetLeft;
    var offY = evt.layerY - mycanvas.offsetTop;
}

but what is offsetLeft and offsetTop? and what is LayerX and LayerY ?

但什么是 offsetLeft 和 offsetTop?什么是 LayerX 和 LayerY ?

采纳答案by Chris Ching

The offsetLeft properties are specific to elements and is described in this documentationas:

offsetLeft 属性特定于元素,在本文档中描述为:

Returns the number of pixels that the upper left corner of the current element is offset to the left within the offsetParent node.

返回当前元素左上角在 offsetParent 节点内向左偏移的像素数。

LayerX specific to events and is described in this documentationas:

特定于事件的 LayerX,在本文档中被描述为:

Returns the horizontal coordinate of the event relative to the current layer.

返回事件相对于当前图层的水平坐标。

Hope that helps!

希望有帮助!

回答by xiaoyi

According to MSDN's document, the layerX and layerY are relative to the nearest positioned ancestor in the DOM tree.

根据 MSDN 的文档,layerX 和 layerY 是相对于 DOM 树中最近定位的祖先。

I'm trying to fix this too...

我也在努力解决这个问题...