JavaScript мышью срабатывает, когда над детьми

Question

Я работаю над меню на моем веб-сайте, и мне нужно, чтобы пользователь показывал / скрывал подменю + анимацию.

Я получил следующий код: http://jsfiddle.net/JyTPW/

Когда я наведите курсор мыши на «продукты», а затем перейду к дочернему элементу, сработает указатель мыши. Я пытался это исправить, но мне не удалось. Я прочитал все сообщения о проверке reltarget и т. Д., Но все же мне не удалось заставить его работать.

Буду очень признателен за вашу помощь.

Редактировать :
После долгих поисков я обнаружил кросс-браузерную регистрацию событий , которые обеспечивают указатель мыши и отпуск мышью.
Это исправило мою проблему.

Answer 1

Ну, если вы думаете об этом, он делает это, как ожидалось. Но не так, как хотелось бы программисту. Microsoft пошла по пути того, что вы хотели. Все остальные не сделали. Решение? Используйте jQuery и слушайте пользовательское событие mousenter / mouseleave

Answer 2

Глядя на исходный код jQuery (открытый исходный код - лучший), вы можете увидеть, как они его реализовали.

https://github.com/jquery/jquery/blob/91824bd2923b99b03fd1a9c4447b46fd7cc96615/src/event.js#L659

Хотя некоторые API jQuery используются внутри обработчика, вы можете четкопосмотри, как это работает.Он проверяет объект события mouseover и проверяет, является ли relatedTarget самим элементом или его потомком.Если это так, он вызывает обратный вызов триггера mouseleave.