Question

How can I call a function when a user stops/ends an event like so:

I have a hover Event Listener like so:

elem.addEventListener("mouseover", function(e){
    alert("hovering");
},true);

And I want to call the following when the user stopped hovering:

alert("stopped hovering");

Is there any neat way of doing so, that does not require using a normal mouse move event?

Answer 1

First of all, in Javascript the hover state is called mouseover.

elem.addEventListener("mouseover", function(e){
    alert("hovering");
    var mouseOut = function(){
        alert('Mouse leaved');
        this.removeEventListener('mosueout',mouseOut);
    }
    this.addEventListener('mouseout',mouseOut);
},true);