垂直菜單/手風琴與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中

回答

相關問題