JavaScript передает событие mouseenter элементу, который находится под другим элементом

#javascript #jquery #google-calendar-api #z-index #jquery-events

#javascript #jquery #google-calendar-api #z-индекс #jquery-события

Вопрос:

Я пытаюсь создать небольшое приложение для календаря, похожее на Календарь Google. Я пытаюсь создавать события с помощью функции щелчка и перетаскивания, чтобы события выравнивались по сетке. Я пытаюсь привязать перетаскивание к элементам TD под элементом event DIV, который работает при перемещении вниз (удлинении события), но не работает при перемещении вверх (сжатии события).

Происходит то, что mouseenter событие запускается для элемента event DIV, но оно никогда не запускается для базового TD. Если вы попытаетесь изменить размер DIV, переместившись вверх сбоку, это сработает, потому что TDS фактически получает mouseenter событие.

Календарь Google и календарь недели jQuery используют mousemove событие, но mousemove событие запускается для каждого пикселя, что кажется пустой тратой времени. Есть ли способ написать это без использования mousemove события?

Возможно ли поместить элемент DIV за таблицей и TDs? Если таблица несколько прозрачна, пользователь все равно сможет видеть DIV, но фактически будет запускать события в TDs. Я пытался сделать это с z-index помощью, но, похоже, это не сработало.

Пример кода jsFiddle: http://jsfiddle.net/rockymeza/8SHpA /

1. Когда я расстраиваюсь из-за нормализации событий, я просто вытаскиваю свою стандартную библиотеку функций и событий, которые я вызываю jQuery .

2. @zzzBov Я не думаю, что вы поняли мой вопрос, я на самом деле использую jQuery. Это не ошибка межбраузерной нормализации, с которой я сталкиваюсь.

Ответ №1:

Похоже, у вас такая же проблема, как и у меня:

вы хотите запустить событие за элементом? Ответ — CSS. Установите pointer-events:none; на родительский элемент.

Я провел тест, в котором я пытался (безуспешно) реализовать то же поведение на сенсорных устройствах. Вы можете проверить это по адресу: http://www.hakoniemi.net/misc/pointer-events.html если это поможет вам решить вашу проблему.

1. Спасибо @zvona, если бы мне не нужно было поддерживать IE, я бы использовал pointer-events . Вместо этого я пошел с z-index: -1 ним . Я думал, что мог бы использовать z-index: 2 на столе и z-index: 1 в div, но, думаю, это не сработает. Негатив z-index , кажется, работает на меня.