4

I have an issue with jQuery and the hover event.

The issue is that the mouse event handlers are firing despite not leaving the div. Causing the div to flicker.

Here is an example: http://jsfiddle.net/Fxy9P/

If you move your mouse slowly over the div, it will fire the effects repeatedly despite not leaving the div.

What am I doing wrong?

1 Answer 1

8

The mouseleave event fires as soon as the element is fully invisible. Try

$(this).fadeTo('slow', 0.5);

for comparison.

EDIT:

This should do what you wanted:

$(document).ready(function() {

  $('#strip').mouseenter(function() {
    $(this).fadeTo('fast', 0.0);
  });
  $('#strip').mouseleave(function() {
    $(this).fadeTo('fast', 1);
  });

});
2
  • Thank you for that! So obvious now! I definitely won't forget that little hint for long time.
    – stuartc
    Jun 24, 2011 at 10:05
  • Just helped me out a ton. Thanks for your solution :D May 29, 2013 at 10:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.