Search code examples
event-handlingprototypejsunobtrusive-javascriptmouseout

Javascript: Event Listener mouseout

let me explain my problem. I have a mouseout event assigned to a div tag with an id of calendar. Now when this handler is called (when the mouse is not over the calendar div), i want to wait 2 seconds, then see if the mouse is still not over the calendar div. If the mouse i still out then do a function, if not then do nothing.

I use the prototype javascript library. My code is as follows: 

$('calendar').observe('mouseout', function (event){ 
    setTimeout(/* call this event again */, 2000);
}

Thanks

Solution 
  • $('calendar').observe('mouseout', function(e) {
   myTimeout = setTimeout(function() { /* stuff to do after 2 secs */, 2000);
});

$('calendar').observe('mouseover', function(e) {
   if(myTimeout) window.clearTimeout(myTimeout);
});