javascript - 水平菜单样式“溢出”子菜单

Question

我有一个水平菜单和另一个水平子菜单。我遇到的问题是样式。我正在努力做到这一点，以便当激活主菜单元素并显示相应的子菜单时，主菜单元素的颜色会流血以覆盖两个菜单之间的空白，如下图所示：

只是为了澄清上面的图片是我正在搜索的粗略图像操纵近似值。

我在 CMS Made Simple 中这样做，所以这只是代码的近似值：

 <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>