2

首先，我觉得这个有点难以解释，因为英语不是我的母语。所以请原谅混乱。

我写了一个小通知功能，它是在表单提交时触发的。正常行为是：

  • 用户提交表单
  • 音符淡入
  • 2 秒延迟
  • 笔记淡出

当音符悬停时，它会扩展css-transition。从逻辑上讲，它不应该淡出，直到用户折叠它mouseleave。fadeOut这就是我的问题：只要 div 悬停，我如何防止语句被执行？

我尝试了类似的东西

if ($('#notification').hover()){
    return ;
}

但当然，第一条语句已经执行，如下所示：

http://jsfiddle.net/6DsJb/

我还尝试了其他一些东西，比如一个单独的脚本，它正在监听hover事件，然后调用$('#notification').show() ;

两者都不起作用。我知道这是推理中的一个简单错误，但是地狱，我被卡住了。

提前致谢。

4

2 回答 2

1

fadeIn调用后setTimeout，使用以下功能：

  • 如果通知已折叠，请将其隐藏。
  • 否则，.mouseleave一旦它失去鼠标焦点，就使用它来隐藏它。

IE：

$('#notification').fadeIn(500);

setTimeout(function() {
  if (notification_is_collapsed)
    $('#notification').fadeOut(500);
  else
    $('#notification').mouseleave(function() {
      $('#notification').fadeOut(500);
    });
}, 2000);
于 2012-07-10T12:27:59.653 回答
1

悬停函数有 2 个参数：鼠标何时进入，鼠标何时退出（http://api.jquery.com/hover/）

所以你可以做这样的事情：

$('#notification').hover(
function() {}, function() {
    $(this).delay(500).fadeOut(500);
});

这是您的 jsfiddle 更新：http: //jsfiddle.net/6DsJb/1/

于 2012-07-10T12:30:00.720 回答