How do I check if the mouse is over an element in jQuery?
This code illustrates what happytime harry and I are trying to say. When the mouse enters, a tooltip comes out, when the mouse leaves it sets a delay for it to disappear. If the mouse enters the same element before the delay is triggered, then we destroy the trigger before it goes off using the data we stored before.
$("someelement").mouseenter(function(){
clearTimeout($(this).data('timeoutId'));
$(this).find(".tooltip").fadeIn("slow");
}).mouseleave(function(){
var someElement = $(this),
timeoutId = setTimeout(function(){
someElement.find(".tooltip").fadeOut("slow");
}, 650);
//set the timeoutId, allowing us to clear this trigger if the mouse comes back over
someElement.data('timeoutId', timeoutId);
});
A clean and elegant hover check:
if ($('#element:hover').length != 0) {
// do something ;)
}
WARNING: is(':hover')
is deprecated in jquery 1.8+. See this post for a solution.
You can also use this answer : https://stackoverflow.com/a/6035278/8843 to test if the mouse is hover an element :
$('#test').click(function() {
if ($('#hello').is(':hover')) {
alert('hello');
}
});