jQuery hover with fade timing problem w/ screenshot

When hovering over a map bullet I'm fading out, changing the background position of the sprite, then fading back in. But I'm having a problem with consistency when this action is done quickly across several开发者_开发百科 bullets.

Ideas how I can tweak this without having to make an specific event for each bullet?

$("#map a").hover(
  function () {
    $(this).fadeOut(200, function () {
      $(this).css('backgroundPosition', '0 0');
      $(this).fadeIn(200);
    });
  },
  function () {
    $(this).fadeOut(200, function () {
      $(this).css('backgroundPosition', '');
      $(this).fadeIn(200);
    });
  }
);

Thanks for the brain power!

...But I think I'm just going to remove this functionality in lieu of some fancy tooltips that don't mesh so well with the fading. Thanks for stopping by!

Without seeing a demonstration, Im taking a guess that you need to stop your other bullets to achieve your desired effect using .stop()

$(this).stop(true, true).fadeOut(200, function () {
  $(this).css('backgroundPosition', '0 0');
  $(this).stop(true, true).fadeIn(200);
});

You can use a boolean value to check if you're currently animating something.

animating = false;

$('.something').hover(function() {
    if(animating) {
        return;
    }
    animating = true;
    $('.other').fadeOut(200, function() {
        animating = false;
    });
});