[FIXED] How to prevent document mouseout event from being triggered when the mouse enters an iframe?

Issue

I'm detecting if the mouse leaves the window as specified in this answer: How can I detect when the mouse leaves the window?.

The problem is that the browser triggers this event when the mouse enters an iframe (an embedded Youtube video in my case).

How can I prevent that?

Solution

You simply have to modify the handler this way:

addEvent(document, "mouseout", function(e) {
    e = e ? e : window.event;
    var from = e.relatedTarget || e.toElement;

    // we will check if this won't be iframe
    var to = e.target || e.srcElement;
    if ((!from || from.nodeName == "HTML")
      && to.nodeName !== "IFRAME") {
        console.log('mouse out')
    }
});

EDIT Added e.srcElement option to support IE

Answered By - Bogdan Kulynych

Answer Checked By - Timothy Miller (PHPFixing Admin)