Mouseout event detection in IE8
I'm having a little problem detecting when the user leaves the window in IE8. I know the addEventListener method is only supported in IE9 + versions, so I came up with this solution:
function popUp() {
console.log("i'm leaving")
}
if (window.addEventListener) {
window.addEventListener("mouseout", popUp);
} else {
window.attachEvent("mouseout", popUp);
}
It works correctly in all major browsers, but still doesn't work in IE8. I was hoping that using jQuery would solve the problem:
$(window).mouseout(function(){
popUp()
})
but because of this information, no mouseover or mouseout event works in IE8 window.
So the question is, how can I get it to work in this completely outdated but unfortunately popular browser? Any help would be really appreciated
source to share
Back when these browsers, where lately (a long time ago) the only way to get a triggered event for a pointer outside of the browser is to wait for an event blur
(which includes the user clicks outside the browser ):
window.attachEvent
? window.attachEvent('onblur', method)
: window.addEventListener('blur', method);
http://www.quirksmode.org/dom/events/blurfocus.html
Or use Flash, which really did have this ability - at least for going out of stage.
The JavaScript callback method (or at least the one I know of) was supposed to have a thin border only inside the window frame, and if the mouse moved over that area, it would be considered outside. However, it would not be unmistakable if the mouse moved too fast, this area would be skipped, and the faux "mouseout" event would not be fired.
+-----------------------------+
| +-------------------------+ |
| | | |
| | | |
| | NOT ACTUAL SIZE * | |
| | | |
| | | |
| +-------------------------+ | <-- border region
+-----------------------------+
* Any reference to an ascii representation of a screen, live or dead, is purely random.
So not perfect, but also these archaic browsers - at least with modern eyes.
source to share