多級下拉菜單在HTML中閃爍

Question

任何人都請告訴我加載產品的子菜單有什麼問題。

這裏是鏈接：

http://www.lexurcapacitor.com/index.html

這是CSS鏈接：

http://www.lexurcapacitor.com/css/style.css

Answer 1

我發現，因爲在<script src="js/dualflow.js"></script>文件中的代碼菜單閃爍;

c("#header-nav").delegate("li","mouseenter mouseleave",function(f){

此代碼當在<nav id="header-nav">內的利元件上的的mouseenter或鼠標離開事件觸發執行。這個代碼的缺點是，它也考慮子菜單中的li！

我得到的最簡單的解決方法是對第一菜單項的李元素的類（如：主頁，關於，產品...）

HTML UPDATE

<nav id="header-nav"> 
     <ul> 
      <li class="current menu"> 
       <a href="index.html">Home</a> 
      </li> 
      <li class="menu"> 
       <a href="about.html">About</a> 
      </li>      
      <li class="menu"> 
       <a href="msc.html">Products</a> 
       <ul> 
        <li> 
         <a href="msc.html">Motor Start Capacitor</a> 
         </li> 
         <li> 
          <a href="mrc.html">Motor Run Capacitor</a> 
         </li> 
         <li> 
          <a href="tc.html">Terminal Capacitor</a> 
         </li> 
         <li> 
          <a href="bstc.html">Box Square Type Capacitor</a> 
         </li> 
         <li> 
          <a href="flc.html">Fluorescent Lighting Capacitor</a> 
         </li> 
         <li><a href="fc.html">Fan Capacitor</a> 
         </li>     
        </ul> 
       </li> 
       <li class="menu"> 
        <a href="needus.html">Need us</a> 
       </li> 
       <li class="menu"> 
        <a href="network.html">Network</a> 
       </li> 
       <li class="menu"> 
        <a href="certificate.html">Certificates</a> 
       </li> 
       <li class="menu"> 
        <a href="contact.html">Contact</a> 
       </li> 
      </ul> 
     </nav> 

dualflow.js UPDATE

更新dualflow.js與FOL文件降脂代碼（添加類 '菜單'）

c("#header-nav").delegate("li","mouseenter mouseleave",function(f){

c("#header-nav").delegate("li.menu","mouseenter mouseleave",function(f){