如何在前一个动作仍在发生时阻止JQuery动作

我在悬停时滑动的页面上有一个div，然后在悬停时退出。如果您随后悬停在物品上，则所有动作都会排队并触发，导致物品不断滑动，即使您不再与其交互。如何在前一个动作仍在发生时阻止JQuery动作

您可以在我正在开发的网站上看到此操作here。只需将鼠标悬停在中心的大图像上即可查看要显示的信息div。

理想情况下，应该发生的是，当动画发生时，不应再排队。

这里是我当前的代码：

$(document).ready(function(){ 
    $(".view-front-page-hero").hover(
     function() { 
      $hero_hover = true; 
      $('.view-front-page-hero .views-field-title').slideDown('slow', function() { 
       // Animation complete. 
      }); 
     }, 
     function() { 
      $hero_hover = false; 
      $('.view-front-page-hero .views-field-title').slideUp('slow', function() { 
       // Animation complete. 
      }); 
     } 
    ); 
});

提前感谢！

来源

2011-01-13 Shadi Almosri

创建一个全局变量。动画开始时。完成时清除它。如果在调用动画之前设置此变量，则设置一个条件以退出函数。

来源

2011-01-13 19:09:09

难道也可以将数据附加到用`$的元素。数据（）`？ – Marnix 2011-01-13 23:10:59

这可能不是最好的解决方案，但是如果在动画之前运行stop(true, true)，它应该可以工作。

现场演示：http://jsfiddle.net/TetVm/

来源

2011-01-13 19:18:47

$(document).ready(function(){ 
var continue=true; 
    $(".view-front-page-hero").hover(
     function() { 
     if(continue){ 
      $('.view-front-page-hero .views-field-title').slideDown('slow', function() { 
       continue=false; 
      }); 
      } 
     }, 
     function() { 
     if(continue!){ 
      $('.view-front-page-hero .views-field-title').slideUp('slow', function() { 
       continue=true; 
      });  
      } 
     } 
    ); 
});

//这会让你的代码工作正确...

来源

2011-01-14 14:29:24 onront

如何在前一个动作仍在发生时阻止JQuery动作

回答

相关问题