Javascript: получить положение мыши относительно родительского элемента

есть ли способ получить положение мыши относительно родительского элемента?

допустим, у меня есть структура:

<div id="parent">
    <span class="dot"></span>
</div>

когда я подношу свою мышь span элемент мне нужно получить его положение относительно его родительского элемента (<div id="parent">). PageX / ClientX дает мне позицию относительно страницы / клиентской области, поэтому она не работает для меня.

3 ответов


вычесть положение родительского элемента (offsetLeft; offsetTop) из положения мыши (pageX; pageY), чтобы получить относительное положение. Не забудьте взять offsetParent во внимание, если у вас есть несколько уровней смещения.

например:

element.addEventListener("mousedown", function (e) {
  let x = e.pageX - parent.offsetLeft;
  let y = e.pageY - parent.offsetTop;

  console.log(x, y);
});

здесь element ваш внутренний элемент получает событие, и parent является вашей желаемой ссылкой для координат.


смещение jquery () метод обрабатывает родительское позиционирование, поэтому

function onsomemouseevent(e) {
    var x = e.pageX - $(e.target).offset().left;
}

простой браузер абстрактный jquery.


попробуйте свойство offsetParent. http://help.dottoro.com/ljetdvkl.php

попробуйте это: позициях = документ.getElementByID ('childId').offsetParent.offsetLeft; positionY = документ.getElementByID ('childId').offsetParent.offsetLeft;