css和jquery顯示隱藏粘性子菜單

我有一個導航水平子導航需要粘在子頁面上。css和jquery顯示隱藏粘性子菜單

我把所有的與CSS的工作，但問題是，我需要在子頁面粘ul當我將鼠標懸停在另一位家長li並回到黏當我徘徊在不被隱藏。我認爲jQuery是唯一的解決方案。

這是我迄今爲止：如果

<style type="text/css"> 
.current-menu-parent ul{ 
display:block !important; 
position:absolute!important; 
} 
#primary-nav ul li:hover ul { 
display:inline; 
position:absolute; 
} 
#primary-nav ul li > ul{ 
    display:none; 
} 
</style 

<script src="http://code.jquery.com/jquery-latest.min.js"type="text/javascript"> </script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$("#primary-nav ul li").mouseover(function(){ 
    $('.current-menu-parent ul').hide(); 
}); 
$("#primary-nav ul li").mouseout(function(){ 
    $(".current-menu-parent ul").show(); 
}); 
}); 
</script> 
<body> 
<div id="primary-nav"> 
    <ul> 
    <li>item</li> 
    <li class="current-menu-parent>This is the current menu parent item 
     <ul> 
      <li>Current page</li> 
      <li>page</li> 
      <li>page</li> 
     </ul> 
    </li> 
    <ul> 
</div>

對不起有錯字只是快速地重新寫這個。

這是鏈接，您可以直接看到問題。只要點擊一個子頁面就可以看到問題。

來源

2012-07-09 codeprokanner

上.current-menu-parent ul

.current-menu-parent ul{ 
    display:block; 
    position:absolute; 
}

刪除important這是造成粘。

下一個問題是由於.show()對.mouseout()造成的，反之亦然。

$("#primary-nav ul li").mouseover(function(){ 
    $('.current-menu-parent ul').show(); 
}); 
$("#primary-nav ul li").mouseout(function(){ 
    $(".current-menu-parent ul").hide(); 
});

參考LIVE DEMO

來源

2012-07-09 19:30:55

清楚，解決了第一個問題...八九不離十了。唯一的問題是，現在當我將鼠標懸停在粘滯的ul上時，它會跳出來，就像jquery繼承了這些項目。我試圖更準確地針對父李，並使用第一個孩子選擇器，但似乎都沒有工作。 – codeprokanner 2012-07-09 20:09:03

css和jquery顯示隱藏粘性子菜單

回答

相關問題