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的默認懸停功能並不理想。