Сделать элемент видимым для пользователя, но невидимым для событий

Question

Я не совсем уверен, как описать, что я собираюсь сделать, но я сделаю все возможное.

На данный момент у меня есть родительский элемент <div> с абсолютно позиционированным дочерним элементом <div> s, и я отслеживаю координаты расположения указателя мыши относительно элемента, над которым находится ваша мышь.

В тот момент, когда я наводю курсор мыши на своих дочерних элементов <div> s, я получаю расположение мыши относительно них, но я хочу, чтобы координаты были относительно родительского <div> даже при наведении курсора на дочерние элементы.

Поэтому я хочу, чтобы дочерние элементы были видимыми, но прозрачными для перемещения мыши, поэтому я хочу, чтобы перемещение мыши проходило прямо к родительскому элементу.

Как бы я это сделал? Может быть, мне нужно каким-то образом заставить родителя <div> быть на переднем плане, но при этом все же проследить за дочерью <div>? или сделать прозрачное <div> наложение только для того, чтобы получить координаты мыши?

Answer 1

Вы можете сделать элемент "прозрачным" для событий, установив для его свойства pointer-events CSS значение none. Например:

<div><!--container-->
<div style="pointer-events: none"><!--inner div; will not respond to mouse clicks-->
</div>
</div>

Answer 2

Хорошо, я разработал способ, которым я могу игнорировать дочерние элементы при наведении на них курсора.

При получении цели события я могу просто изменить цель на parentNode, если className цели соответствует чему-либо:

if (target.className.toLowerCase() === 'ignoreme') { target = target.parentNode; }

Answer 3

вы используете в своем коде event.target (srcElement), просто избавьтесь от этого и замените на рассматриваемый div.

Answer 4

Если вы поместите свои обработчики событий в родительский div, то это будет то, что получает события, когда они всплывают. Что касается вопроса о позиционировании, это может сделать вашу жизнь проще, если ваш родительский div будет position: relative. Насколько я знаю, координаты мыши в событии всегда относятся к окну, так что вам все равно придется делать математику. Я действительно тупой, и я мог понять это в прошлом методом проб и ошибок:)