jquery - 如何在鼠标移开时添加一秒延迟

Question

我以为这很简单，但错了...尝试使用 .delay 和在线找到的其他方法的组合，但无法让它在没有错误的情况下工作。

我只想在鼠标移开 .hover-area 时添加一秒的延迟...有什么想法吗？

提前致谢!!!

$('.forward').css({ opacity:0, right:-20 });
$('.backward').css({ opacity:0, left:-20 });

$('.hover-area').hover(function () {
  var conf_1 = { queue:false, duration:300, easing:'easeOutCubic' };
  var conf_2 = { queue:false, duration:400, easing:'easeOutCubic' };

  $(this).find('.backward, .forward').each(function () {
    $(this).stop()
      .animate($(this).data('animate-on'), conf_1)
      .animate({ opacity:0.7 }, conf_2);
  });
}, function() {
  var conf_1 = { queue:false, duration:550, easing:'easeOutSine' };
  var conf_2 = { queue:false, duration:300, easing:'easeOutSine' };

  $(this).find('.backward, .forward').each(function () {
    $(this).stop()
      .animate($(this).data('animate-off'), conf_1)
      .animate({ opacity:0 }, conf_2);
  });
}); 

Answer 1

一切似乎都很好，只需在回调函数中的.stop()之后执行.delay()尝试一下:

$(this).find('.backward, .forward').each(function () {
$(this).stop().delay(1000)
  .animate($(this).data('animate-off'), conf_1)
  .animate({ opacity:0 }, conf_2);
});

我在这里所做的只是在您的mouseout回调function()中添加了一个.delay()。