Crossbrowser onMouseenter

Question

У меня есть некоторые проблемы с прикреплением onMouseover к целому элементу и его дочерним элементам, поэтому я решил взглянуть на Microsoft onMouseenter, который основан на положении мыши, теперь мне интересно, есть лиявляется кросс-браузерным решением или, по крайней мере, исправление для onMouseover, которое будет применено и к дочерним элементам div.

PS Я не должен использовать для этого jQuery или другие фреймворки.

Ценю любые идеи.

Answer 1

РЕДАКТИРОВАТЬ: Вот лучшее решение, чем мой оригинал.Вместо этого он проверяет e.relatedTarget против this.parentNode.

Кажется, чтобы дать точные результаты:

if(  e.relatedTarget !== this.parentNode ) return;

Пример: http://jsfiddle.net/FPKKX/1/

... так что вы бы сделали:

el.onmouseover = function( e ) {
    // typical event obj fix

    if(  e.relatedTarget !== this.parentNode ) return;

    // This will only log to the console for the <div>
    console.log( e.target.tagName, e.relatedTarget.tagName );
};

---

Оригинал

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

Пример: http://jsfiddle.net/FPKKX/ (прочитайте комментарии к коду и откройте консоль)

el.onmouseover = function( e ) {
    // typical event obj fix

    // if the event is the result of bubbling, return.
    if( this !== e.target ) return;

    // rest of code
};

Теперь код после if() срабатывает только в том случае, если цель события совпадает с элементом, к которому был применен обработчик, что фактически делает пузырьки событий неэффективными для этого события.

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

Answer 2

Если вы хотите использовать библиотеку, такую ​​как jQuery, существует событие mouseenter, которое должно быть кросс-браузерным:

http://api.jquery.com/mouseenter/