jQuery的延迟鼠标移出

我有这样的脚本：jQuery的延迟鼠标移出

$("#menu ul li").mouseover(
    function() { 
     $(this).find(".submenu").fadeIn("slow"); 
    } 
); 

var timer = 0; 
function animate_me() { 
    $(this).find(".submenu").stop().fadeOut("slow"); 
} 
$(function(){ 
    $("#menu ul li").mouseout(function(){ 
     timer = setTimeout("animate_me()", 300); // start timer when mouse is moved in 
    }, function() { 
     clearTimeout(timer); // stop it if mouse is moved out 
    }); 
});

我如何延缓淡出，直到菜单UL里已经打探过两秒钟？

来源

2012-02-07 maccaj51

所有的鼠标，mouseout，只有一个参数。如果你想以这种方式使用它，你需要使用.hover()。然后，你可以只使用.dealy()来实现自己的目标，.stop(true,true)将清除延迟

这里是一个演示： http://jsfiddle.net/meo/zTTFJ/

来源

2012-02-07 12:35:56 meo

延迟只会延迟淡出 - 我需要它停止函数，如果再次注销 – maccaj51 2012-02-07 12:43:25

如果您使用true作为第一个参数在'.stop（）'它停止延迟也...试试演示... – meo 2012-02-07 12:46:55

使用HoverIntent plugin for jQuery。它完全符合你的需求和更多。

具体而言，超时功能提供此功能。实例：

function showIt() { $(this).find(".submenu").fadeIn("slow"); } 
function hideIt() { $(this).find(".submenu").stop().fadeOut("slow"); } 

$("#menu ul li").hoverIntent({ 
    over: showIt, 
    out: hideIt, 
    timeout: 300 /*ms*/ 
});

从文档

超时：

一个简单的延迟，以毫秒为单位的 “出” 功能之前被调用。如果用户在超时之前将鼠标置于元素上，则过期，则不会调用“out”函数（也不会调用“over” 函数）。这主要是为了防止马虎/人类暂时（无意）将用户从目标元素上移开的移动轨迹......让他们有时间返回。默认超时：0

来源

2012-02-07 12:34:25

它的一个很好的评论，但它是一个答案？ – meo 2012-02-07 12:50:05

这是一个答案，使用插件，解决了问题。 – 2012-02-07 12:50:41

我不想得到一个链接到一个插件作为一个具体问题的答案... – meo 2012-02-07 12:53:41

jQuery的延迟鼠标移出

回答

相关问题