How to avoid a js action if the mouse is over an element

Working with javascript you can have a problem like that: you want to call an action after few milliseconds from the onready event.

To do that you can use the setTimeout function at the domready event.
For example we want to show the alert ‘Hello setTimeout World’ after 1000 ms from the domready event.

Using Mootools:

window.addEvent('domready', initHandler);

var g_initial_timeout = null;
var initHandler = function() {
    initial_timeout = setTimeout(function() {
        alert('Hello setTimeout World');
    }, 1000);
};

Using jQuery:

$(window).load(initHandler);

var g_initial_timeout = null;
var initHandler = function() {
    initial_timeout = setTimeout(function() {
        alert('Hello setTimeout World');
    }, 1000);
};

Now, if we want to avoid to show the alert if, at the page loading, the mouse is over a particular dom element, we can clear our timeout.

Using Mootools:

$('your-element-id').addEvent('mouseover', function(){
    if (g_initial_timeout) {
        clearTimeout(g_initial_timeout);
    }
});

Using jQuery:

$('#your-element-id').hover(function(){
    if (g_initial_timeout) {
        clearTimeout(g_initial_timeout);
    }
});

What do you think about this solution? Let me know

Tags: clearTimeout, domready, javascript, jquery, mootools, setTimeout