需要帮助的JQuery的鼠标悬停菜单与子菜单
问题描述:
我有这个菜单(@ jsFiddle),其中会出现这种情况给出下面的鼠标事件:需要帮助的JQuery的鼠标悬停菜单与子菜单
- 悬停在
Movies
- 然后开始拖动鼠标鼠标悬停在
Movie library
- 拖动时不小心触摸
Home
菜单项 - 导致
Home
子菜单出现并隐藏Movies
子菜单。
这不是我想要的效果。所以即时寻求一些援助。我该如何解决这个问题,如果即时通讯拖动我的鼠标,我不小心触摸了一些其他菜单选项,JavaScript将足够聪明,知道它不应该隐藏所选的子菜单。
我可以在悬停上添加某种延迟吗?所有帮助表示赞赏!
答
我希望这是你想要的。如果没有,我相信它会引导你到最后的解决方案
$().ready(function(){
$('ul.menu').hover(function(event){
var hoverItem = event.target;
//hide other ul's submenu
$(hoverItem).siblings('li').children('ul').stop(true,true).hide()
//show current submenu
$(hoverItem).children('ul').stop(true,true).fadeIn()
},function(event){
//console.log(event.target);
$('ul.menu li').children('ul').stop(true,true).delay(1500).fadeOut()
})
});
希望能帮助你。干杯
+0
没有不完美。现在,如果将鼠标悬停在“家庭”上以转到“电影”,则只显示家庭子菜单。 – netbrain 2011-05-05 08:05:03
我想尽量减少外部库的使用。 – netbrain 2011-05-05 07:55:18
当然,你可以检查这个插件源,并采取你想要的......至少你会得到一些灵感。 – NilColor 2011-05-05 08:15:57
您能否提供一个如何将插件与现有代码集成的示例? (如果这不是太多问) – netbrain 2011-05-05 08:21:20