canvas.onmousedown = function(e) { pos_left = e.pageX - e.currentTarget.offsetLeft; pos_top = e.pageY - e.currentTarget.offsetTop; console.log(pos_left, pos_top) }
HTMLElement.offsetLeft
Свойство
HTMLElement.offsetLeft
только для чтения возвращает количество пикселей, которые верхний левый угол текущего элемента смещен влево в узлеHTMLElement.offsetParent
.Для элементов уровня блока
offsetTop
,offsetLeft
,offsetWidth
иoffsetHeight
описывают рамку поля элемента относительноoffsetParent
.Однако для элементов встроенного уровня (например,
span
), которые могут переноситься из одной строки в другую,offsetTop
иoffsetLeft
описывают позиции первого пограничного поля (используйтеElement.getClientRects()
, чтобы получить его ширину и высоту ), аoffsetWidth
иoffsetHeight
описывают размеры ограничивающего прямоугольника (используйтеElement.getBoundingClientRect()
, чтобы получить свою позицию). Поэтому поле с левым, верхним, шириным и высотойoffsetLeft
,offsetTop
,offsetWidth
иoffsetHeight
не будет ограничивающим полем для диапазона с обернутым текстом.HTMLElement .offsetTop
Свойство
HTMLElement.offsetTop
только для чтения возвращает расстояние от текущего элемента относительно вершины узлаoffsetParent
.MouseEvent.pageX
Свойство
pageX
только для чтения возвращает X (горизонтальную) координату в пикселях события относительно всего документа. Это свойство учитывает любую горизонтальную прокрутку страницы.MouseEvent.pageY
Свойство
MouseEvent.pageY
только для чтения возвращает Y (вертикальную) координату в пикселях относительного события на весь документ. Это свойство учитывает любую вертикальную прокрутку страницы.Дополнительные сведения см. В Mozilla Developer Network:
https://developer.mozilla.org/ en-US / docs / Web / API / MouseEvent / pageX https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/pageY https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetLeft https://developer.mozilla.org/en-US/docs/Web/API/ HTMLElement / offsetTop