jQuery IE扩展可靠区域

Question

我有一段代码，我正在使用的地方改变结构不是一个真正的选择。我有一个基于div的下拉菜单，基本如下所示：

<div id="menugroup"> 
    <div id="menuheader1">header</div> 
    <div id="menuitems"> 
     <div>menuitem1</div> 
     <div>menuitem1</div> 
     <div>menuitem1</div> 
     <div>menuitem1</div> 
    </div> 
</div> 

menuitems is display：none by default。我将一个jQuery悬停事件附加到menugroup上，这样当您将鼠标悬停在div上时，menuitems将变为display：block，并且当您停止悬停时，menuitems将变为display：none。

这在Firefox中很好用，但我在IE中遇到问题。只要我的鼠标离开menuheader1的物理区域（所有最初可见的menugroup），它就会触发鼠标移动，即使我的鼠标仍然悬停在菜单项目中的东西上，现在它已成为menugroup的一部分。

在不改变物理结构的情况下，如何使jQuery悬停区域随menugroup的内容扩展？

Answer 1

现场演示与http://jsfiddle.net将是伟大的，但这是一个共同的问题。像hoverIntent这样的东西对于鼠标敏感问题和用户错误是一个很好的选择。在下拉菜单的情况下，jQuery的默认悬停功能并不理想。