jammypeach jammypeach - 3 months ago 8
jQuery Question

jQuery how to prevent mouseenter triggering when page loads with cursor hovering element

I have an element on my page with a mouseenter event bound to it which changes the dimensions of a child image.

It works just as I want, however if you hit the page with your cursor hovering where the div will be, it triggers as soon as it loads - this is undesired, I want it to do nothing until a mouse cursor actualy enters the div rather than just being there to start with.

I've tried knocking up an example on jsfiddle but the page loads too quickly for me to get the cursor in the right place :(

One possibility is putting the bind method calls in a timeout so that it takes a second to bind the event, but the problem will still happen if the user leaves their cursor over my div.

Any ideas?

Using jQuery 1.6.2

Answer

Hm. Its only idea.

var mouse_already_there = false;
var event_set = false;
$(document).ready(function() {
    $(item).hover(function(){
        if(!event_set) { mouse_already_there = true; }
    }, function(){
        if(!event_set) { mouse_already_there = false; }
    });
    if(mouse_already_there) {
        //do nothing
    } else {
        event_set = true;
        //set event
    }
});