使用setTimeout的Jquery mouseover mouseout菜单

时间:2010-09-16 17:53:11

标签: jquery menu mouseover settimeout mouseout

有人可以帮我解决这个简单的代码..我仍然是js的菜鸟,我不知道我做错了什么。基本上我试图制作鼠标悬停菜单。

function showQuickLinks() {
//show the menu
}
function hideQuickLinks() {
//hides the menu
}

//button mouseover
$("#quick-links-dd").mouseover(function() { 
 showQuickLinks();
});

var mnuTimeout;

//clears timeout when it rolls over the button
$("#quick-links-dd").mouseover(function () {        
   clearTimeout(mnuTimeout);    
})

//$("#quick-links) - quick links container
//hides the menu when the mouse is not over the container
$("#quick-links").mouseout(function () {
  mnuTimeout = setTimeout("hideQuickLinks()",1000);
});

鼠标悬停工作,但当鼠标位于链接容器外时,它不会执行代码。

3 个答案:

答案 0 :(得分:0)

你错过了吗?

("#quick-links").mouseout(function () {
  mnuTimeout = setTimeout("hideQuickLinks()",1000);
});

答案 1 :(得分:0)

var mnuTimeout = null;

$(function() { 
   $("#quick-links-dd").hover() {
       clearTimeout(mnuTimeout);
       showQuickLinks();
   }, function() {  
      mnuTimeout = setTimeout(hideQuickLinks,1000);
   });
});

答案 2 :(得分:0)

我遇到了丢失onmouseout事件的间歇性问题。我最终的解决方案是将鼠标悬停事件添加到周围的元素,并让它们也取消弹出窗口。