水平菜單樣式「溢出」在子菜單上

Question

我有一個水平菜單和另一個水平子菜單。我遇到的問題是造型。我想使它這樣，當一個MainMenu元件被激活，並且對應的子菜單被顯示，則MainMenu的元素種着色滲出以覆蓋下面的圖像中的兩個菜單之間的空白：

只是爲了澄清上面的圖片是一個粗略的圖像操縱我正在尋找的近似值。

我在CMS這樣製造簡單，所以這是唯一的代碼的近似值：

<nav id="mainmenu"> 
     <ul> 
      <li>Main Menu 1</li> 
     </ul> 
</nav> 

<nav id="submenu"> 
     <ul> 
      <li>Submenu 1</li> 
     </ul> 
</nav> 

Answer 1

既然你沒有提供的代碼，我已經創建了一個模糊的概念： http://jsfiddle.net/FLnke/

<nav id="mainmenu"> 
    <ul> 
     <li onmouseover="javascript:opensub()" onmouseout="javascript:closesub()" >Main Menu 1 | 
      <div id="submenu"></br> 
    <ul> 
     <li>Submenu 1</li> 
     <li>Submenu 2</li> 
    </ul> 
</div> 
     </li> 
     <li>Main Menu 2</li> 
    </ul>