javascript - Jquery:WAITING函数完成

Question

我的问题:
我有几个(告诉 10)元素。将它们悬停在每一个上都会执行一些带有动画的功能。我确实想这样做，如果其中一个元素的功能(和动画)正在运行，悬停在其他一些元素上不会执行该功能。

例如:我将鼠标悬停在元素 2 上。动画开始。随着动画的持续，我悬停在元素 3、4 和 5 上。鼠标光标停留在 5。

我需要什么，当元素 2 的动画结束并且光标停留在 5 上时，5 的动画自动开始。

我已经做到了:

var blocked = 0;    

    $(".my_element").live('hover',function(){
        if(blocked == 0){
        blocked = 1;
        $(this).find('.content').animate({left:"-=100px"}, function() {
            blocked = 0;
        });
      
    }, function(){
});

但是功能完成后，我要摆动鼠标才能开始下一个功能。

Answer 1

我认为您的代码还不错，但是在动画停止的那一刻，您想在当前悬停的元素上引发一个事件。那应该再次触发动画。我猜你也想排除以前的动画元素。

像这样:

var blocked, lastHovered, previous;
$(".my_element").live('hover', function(){
    lastHovered = this;
    if (!blocked && this != previous){
      blocked = true;
      previous = this;
      $('.content').animate({left:"-=100px"}, 1000, function() {
        blocked = false;         
        if (lastHovered) {
          $(lastHovered).trigger("mouseenter");
        }
      });
    }
  }, function() {
    lastHovered = false;
  });