垂直菜单/手风琴与jQuery悬停（）在Internet Explorer中

我想要做的事情非常简单，所以我宁愿不使用jQuery UI或某个插件来扩展我的应用程序。垂直菜单/手风琴与jQuery悬停（）在Internet Explorer中

我有一个菜单结构，像这样：

<ul class="menu"> 
    <li class="main"> 
    <a href="#">Main menu</a> 
    <ul> 
     <li>Sub item</li> 
    </ul> 
    </li> 
</ul>

我有它的风格，因此“子<ul>”是隐藏的。

此代码工作完全在Firefox和Chrome浏览器，但意外的惊喜时，Internet Explorer将触发“鼠标移出”事件，当鼠标在子菜单：

$(function() { 
    $('ul.menu li.main').hover(function() { 
    $(this).find('ul').slideDown(); 
    }, function() { 
    $(this).find('ul').slideUp(); 
    }); 
});

所以在IE7中，当子菜单显示，只要我尝试选择一个项目，菜单再次滑动。

更新：我只是能够尝试IE8，它也能正常工作。所以它只是IE7（也许是6，但我可以忍受这一点）。

我也尝试使用hoverIntent，它声称忽略儿童事件，但它也不起作用。

来源

2011-02-25 Ivan

你有解决方案吗？ – Luke 2011-07-24 22:04:35

不是真的，我只是sto pped关心IE – Ivan 2011-07-25 01:36:03

也许你应该尝试仅选择“li.main”元素来附加悬停事件。

$（ 'li.main'）。悬停（函数（）{ ... }

它应该在IE浏览器。

来源

2011-02-28 16:53:12 Beccari

真的有什么区别？也许你有点混淆，因为我只选择了'li.main'元素。如果我在选择器之间使用逗号，那么我会选择两者。 – Ivan 2011-03-04 14:19:13

这不会真正回答你的问题，但你真的不希望在悬停时使用SlideUp/Down，因为它会上下移动整个菜单项目，因此您永远不会指向想要滑动的内容（当然，当前一个项目已折叠时，它会再次向上移动，因为mouseout）用户体验可能是灾难性的

来源

2011-02-28 17:01:08 Capsule

由于菜单项是*内部触发幻灯片的元素，从技术上讲，当您将鼠标悬停在其子项上时，您仍然位于该容器内，因为Chrome，Firefox和IE8正确运行。 – Ivan 2011-03-04 14:18:04

垂直菜单/手风琴与jQuery悬停（）在Internet Explorer中

回答

相关问题