mouseover function occurring multiple times in a queue

Question

I have this code that fades a div over another one upon mouseover, and fades out when the cursor leave the viewing area.

EXAMPLE: http://jsfiddle.net/3vgbemgu/

Answer 1

You can use .mouseenter() and .mouseleave() instead. They are triggered only once.

$('.under').mouseenter(function() {
  $('.over').fadeIn();
}).mouseleave(function() {
  $('.over').fadeOut();
});