使用stop（）延迟（）或超时？ [英] delay() or timeout with stop()?

问题描述

（$'$'$> $'$ file $'）。（stop）（true，true）。 fadeIn（'fast'）;
}）。live（'mouseleave'，function（）{
$（'＃download'）。stop（true，true）.fadeOut（'fast'）;
}）;

我希望 mouseenter 函数具有 stop（）并延迟1秒。
因此，如果我将鼠标悬停在 #download 上，则应在1秒延迟后开始 fadeIn 。如果我将鼠标移出，则 fadeIn 不应启动。找到我？

我真的不知道该怎么做，有什么想法？

解决方案

您需要使用 setTimeout（） ，因为 .delay（） code> 的作品（以及您无法取消它）。

  $（'。file a' ）.live（'mouseenter'，function（）{
 $ .data（this，'timer'，setTimeout（function（）{
 $（'＃download'）。stop（true，true） （''fast'）; 
}，1000））; 
}）。live（'mouseleave'，function（）{
 clearTimeout（$。data（this，'timer' ））; 
 $（'＃download'）。stop（true，true）.fadeOut（'fast'）; 
}）; 
  

你可以在这里尝试一下。

如果你使用 .delay（） 无论您是否早先清除该队列，它都会为元素下一个动画 。因此，您需要超时才能可以取消，以上方法通过手动方式调用 setTimeout（） 并将结果与​​ $。data（） ，以便稍后通过 clearTimeout（） 。

$('.file a').live('mouseenter', function() {
    $('#download').stop(true, true).fadeIn('fast');
}).live('mouseleave', function() {
    $('#download').stop(true, true).fadeOut('fast');
});

I want the mouseenter function to have a stop() and a delay of 1 second. So, if I hover over #download the fadeIn should start after a 1 second delay. If I mouse out meanwhile the fadeIn shouldn't start. Get me?

I don't really know how to do that, any ideas?

解决方案

You need to use setTimeout() in this case because of how .delay() works (and your inability to cancel it).

$('.file a').live('mouseenter', function() {
  $.data(this, 'timer', setTimeout(function() {
      $('#download').stop(true, true).fadeIn('fast');
  }, 1000));
}).live('mouseleave', function() {
  clearTimeout($.data(this, 'timer'));
  $('#download').stop(true, true).fadeOut('fast');
});

You can give it a try here.

If you use .delay() it'll dequeue the next animation for the element, regardless of if you cleared that queue earlier. So you need a timeout that you can cancel, which the above does by manually calling setTimeout() and storing the result with $.data() so you can clear it later, via clearTimeout().

这篇关于使用stop（）延迟（）或超时？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！