JQuery - Animated Hover Animation

Question

I have a little jQuery animation that disappears in the link when it hangs:

$(function() {
  $('.delete').hide();
  $('#photos img').hover(function() {
    $(this).parents('li').children('.delete').fadeIn('fast');
  }, function() {
    $(this).parents('li').children('.delete').fadeOut('fast');
  });
});

But if I quickly move the mouse to and from the image, a new animation is always added to the queue, and when I stop, I see that the link is pulsating for a while. I tried using .stop (true), but sometimes the fading effect does not work at all (or just down to some opacity value less than 1). What can I do?

Thanks Eric

Answer 1

- hoverIntent . . , , , .

Answer 2

- stop() fadeTo(), :

$(function() {
  $('.delete').fadeTo(0, 0);
  $('#photos img').hover(function() {
    $(this).parents('li').children('.delete').stop().fadeTo('fast', 1);
  }, function() {
    $(this).parents('li').children('.delete').stop().fadeTo('fast', 0);
  });
});

, !