How can I ignore a jQuery animation for some time?

Example:

http://jsfiddle.net/patr开发者_高级运维ioticcow/XnnvD/4/

That is using a delay to delay the animation for a bit but the problem occurs when the user hovers with the mouse a few times over the black image, the animation will remember to continue.

This is an interesting effect but not what I want. I would like the animation not to occur if the user hovers over a few times, let's say in a second or so.

---

If your intent is to delay the animation until the speed of the mouse implies an intent to hover, look into the jQuery HoverIntent plugin. This plugin can be used to fire a hover callback if and only if the mouse has decelerated enough over an item to imply a hover. It can be used by including it and replacing .hover() calls with .hoverIntent() ones.

---

you should use .stop() before animation to prevent animation queue buildup.

prevent-animation-queue-buildup

      $(document).ready(function() {
          $('ul.anim_queue_example1 a')
              .hover(function() {
                  $(this).animate({ left: 20 }, 'fast');
              }, function() {
                  $(this).animate({ left: 0 }, 'fast');
              });
      });

Here is the updated JavaScript that fixes the animation queue buildup by using the .stop() method.

  $(document).ready(function() {
      $('ul.anim_queue_example2 a')
          .hover(function() {
              $(this).stop().animate({ left: 20 }, 'fast');
          }, function() {
              $(this).stop().animate({ left: 0 }, 'fast');
          });
  });

---

Look into using the stop() function of jQuery.

It can assist in preventing the "queue up" of animations. That seems to be the problem.

The first parameter of stop is to clear the queue.

$("#someDiv").hover(function(){
    $(this).stop(true, false).up);
}, function() {
    $(this).stop(true, false).down);
});

More examples are at Full Cycle of Animation on Hover/Off.