如何添加延迟到jQuery淡出？

我正在为一个网站设计一个导航栏，并且我试图展示如何让每个选项卡上出现的子菜单在光标离开选项卡后保持可见状态。由于光标离开后立即淡出，因此我无法在子菜单上设置功能。所以我想要做的是在jQuery中向.hover外侧引入setTimeout（），但没有成功。这里是代码：如何添加延迟到jQuery淡出？

$('.hovernav').hover(
     function() { 
      $(this).css('background-image', $(this).css('background-image').replace("_o.", "_i.")); 
      tabShowSubnav($(this).attr('id')); 
     }, 
     function() { 
      $(this).css('background-image', $(this).css('background-image').replace("_i.", "_o.")); 
      setTimeout('tabHideSubnav($(this).attr("id"))','2000'); 
     });

我对这个设置缺少什么？

来源

2009-09-29 b. e. hollenbeck

function() { 
    .... 
    setTimeout('tabHideSubnav($(this).attr("id"))','2000'); 
}

“这个”在内部功能被设定为obect超时被称为上，这是window，不hovernav的当前实例。

最好不要在setTimeout中使用字符串;改用一个函数。然后，您可以访问封闭范围中的变量，您可以使用该变量记住传递给外部函数的this值。

function() { 
    ... 
    var thisid= this.id; 
    setTimeout(function() { 
     tabHideSubnav(thisid); 
    }, 2000); 
}

（作为奖励，该停止的JavaScript不必从你的字符串每次重新编译的功能。在字符串把代码几乎总是假的。）

注意，你可能需要一些更多的逻辑如果鼠标重新进入hovernav，取消hide-subnav。否则，而不是一个烦人的菜单栏，当鼠标离开时仍然保持关闭状态，如果你在两秒钟之前完成了菜单，则会出现一个更令人讨厌的菜单栏，即使在您将鼠标悬停在菜单栏上时也会关闭该菜单栏。

来源

2009-09-29 02:35:15 bobince

你试过让它显示（）悬停，然后fadeOut（'慢'）鼠标？

http://docs.jquery.com/Effects/fadeOut

Alternatly，你可以.animate（{不透明度：0}，3000）或W/E的量会为你工作。

还有一个编辑：

你可以有.animate（{不透明度：1}，3000），这只会拖延已可见元素为3秒。

来自http://www.learningjquery.com/2007/01/effect-delay-trick

下面是一个简单的片断：

JQuery的

$(function(){ 
     $("#HeaderMenu").mouseover(function(){   
      $("#SubMenu").show(); 
     }); 
     $("#HeaderMenu").mouseout(function(){ 
       $("#SubMenu").animate({opacity: 1}, 3000, function(){$(this).hide()}); 
    });

来源

2009-09-29 02:20:24 Omar

只是走一个猜测这里，但也许“这”超出范围时，该函数被调用。

来源

2009-09-29 02:21:41 Rich

不能 - 因为我可以将setTimeout（）移动到tabHideSubnav函数内部，它根本不起作用 - 没有延迟，没有褪色。我不确定是否可以从setTimeout（）中调用jQuery。出于某种原因，我也无法让jQuery插件来处理这个问题。 – 2009-09-29 02:42:21

然后将jQuery内容包装到另一个函数中，并将它传递给解析元素所需的信息。在匿名函数内部，您可以收集解析元素所需的任何信息，这就是您传递给包装函数的内容 – Rich 2009-09-29 02:57:15

如何添加延迟到jQuery淡出？

回答

相关问题