Question

I have example like below. How to avoid “lost of mouseover” on <div> when mouse is over inner <span> ?

<div id="box">
  ABC
  <span style="font-size: 10px; font-weight: normal;">abc</span>
</div>

Live demo here.

Answer 1

use jquery hover instead of mouseenter/mouseout e.g.

$('#box').hover(function(){
   //Enter code
},
function(){
   //Exit code
});

As another user mentions, you could use a chained event of mousenter and mouse leave e.g.

$(selector).mouseenter(handlerIn).mouseleave(handlerOut);

However, hover is simply shorthand for the above.