Holtorf
Holtorf

Reputation: 1491

How do I check if the mouse is NOT over an element in javascript?

When hovering over an element my site creates a tool tip. When the mouse stops hovering over the element, an mouseout event is called, the tooltip is removed, and all is right with world. Except that sometimes, a user moves their mouse so quickly that by the time the tooltip has been created, the mouse is no longer inside the element. This means the tooltip does not disappear unless the user mouses over and mouses out of the element.

My solution is, after creating the tooltip, to check if the mouse is over the required element, and if it is not, to remove it. Unfortunately I do not know how.

I tried these solutions, but they both require an mouseout event in order to work. Am I missing something, or is there another (hopefully better) way to find if the mouse is currently not over an element?

Upvotes: 4

Views: 2011

Answers (1)

ninjagecko
ninjagecko

Reputation: 91094

It sounds like the browser is throwing MouseOut events and you are ignoring them. Consider binding MouseOut events be default to a handler, even if you haven't set up a tooltip yet.

I would expect that for every MouseIn event, there is a MouseOut event. If that is not the case in the spec or in this particular browser, you have a problem. In this terrible scenario, you can cancel the tooltip after perhaps a second.

Upvotes: 2

Related Questions