Should: hover and mouseout have the same triggering reasons?

When I programmed the aspx site I ran into the problem that a div that had a couple of elements and was displayed on top of other elements (due to position: fixed) remained invisible despite my desires otherwise.

This div should have been invisible if the mouse left the area it was contained in. As easy to think, I used:

<div id="xyz" onmouseout="JavaScript: $('#xyz').hide();">....</div>


this is triggered when I have left the padding area that was defined for the div and entered the elements, or the space between the elements (elements inside the div), .....

Now that I used css instead to do hide:

#xyz.HideOnNotHovered { display: none; }
#xyz.HideOnNotHovered:hover { display: inline-block; }


This worked as intended. So Regardles, where my mouse was inside the div, it was only visible when it left the div, the div disappeared.

This situation (which I was unable to recreate in jsfiddle thanks to a complex layer of css and javascripts that I could not add there) was asked by the question:

When I first thought about the problem, I thought that the onmouseout event and the final: hover procedures are essentially the same (or that onmouseover and: hover are the same and that onmouseout is only called when: hover ends and only under the same circumstances). So my question is, is there / is there a difference between onmouseout and the opposite: hover?


source to share

1 answer

This is the same difference between jQuery events mouseout

and mouseleave


  • mouseleave

    fires only when the cursor leaves the target element - example
  • mouseout

    runs every time the cursor leaves the target element AND casts a child element - example

This is the same behavior for :hover

(css) and onmouseout

in javascript:

  • :hover

    applies when the cursor is within the target element - example
  • onmouseout

    runs every time the cursor leaves the target element AND casts a child element - example

Here's a good referral about these two different behaviors



All Articles