加載Jmenu呈現問題

我正在使用Jquery Jmenu進行菜單顯示。它在IE8中加載頁面時顯示爲列表視圖。加載後，幾秒鐘後顯示爲正常水平視圖。儘管它在Chrome瀏覽器上運行良好。請幫忙。這是我們正在使用的CSS。它在加載菜單時以HTML格式顯示數據。加載時間加載Jmenu呈現問題

.jMenu { 
    display: table; 
    margin: 0; 
    padding: 0 
} 

/* First level */ 
.jMenu li { 
    display: inline; 
    background-color: rgb(000,063,096); 
    margin: 0; 
} 

.jMenu li a { 
    padding: 10px; 
    display: inline; 
    background-color: transparent; 
    color: white; 
    text-transform: capitalize; 
    cursor: pointer; 
    font-size: 12px; 
} 

/* Lower levels */ 
.jMenu li ul { 
    display: none; 
    position: absolute; 
    z-index:9999; 
    padding: 0; 
    margin: 0; 
} 

.jMenu li ul li { 
    background-color: rgb(000, 063, 096); 
    display: block; 
    border-bottom: 1px solid #484548; 
    padding: 0; 
} 

.jMenu li ul li.arrow { 
    background-color: rgb(000, 063, 096); 
    background-image: url('../images/arrow_down.png'); 
    background-repeat: no-repeat; 
    background-position: center center; 
    height: 6px; 
    padding: 0; 
    border-bottom: none; 
    padding-bottom: 10px 
} 

.jMenu li ul li a { 
    font-size: 11px; 
    text-transform: none; 
    padding: 5px; 
    display: block; 
    border-top: 1px solid transparent; 
    border-bottom: 1px solid transparent; 
} 

.jMenu li ul li a.isParent { 
    background-color: #f2f2f2 ; 
    background-image: url('../images/arrow_right.png'); 
    background-repeat: no-repeat; 
    background-position: right center; 
    color: #000000; 

} 

.jMenu li ul li a:hover { 
    background-color: #c4e0f6; 
    border-top: 1px solid #c4e0f6; 
    border-bottom: 1px solid #c4e0f6; 
    color: #000000; 
}

綁定使用HTML格式標記與文字

<table border="0" cellspacing="0" width="100%"> 
    <tr> 
     <td style="width: 100%" class="topMenuBar"> 
      <asp:Literal ID="Literal1" runat="server"></asp:Literal> 
     </td> 
    </tr> 
</table>

jQuery函數時沒有將jQuery CSS fileson菜單

<link rel="stylesheet" type="text/css" href='<%# ResolveUrl("~/jMenu-master/css/jMenu.jquery.css") %>'/> 
    <script type="text/javascript" src='<%# ResolveUrl("~/jMenu-master/js/jquery.min.js") %>'></script> 
    <script type="text/javascript" src='<%# ResolveUrl("~/jMenu-master/js/jquery-ui.js") %>'></script> 
    <script type="text/javascript" src='<%# ResolveUrl("~/jMenu-master/js/jMenu.jquery.js") %>'></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#jMenu").jMenu({ 
       ulWidth: '150', 
       effects: { 
        effectSpeedOpen: 300, 
        effectTypeClose: 'slide' 
       }, 
       animatedText: false 
      }); 
     }); 


    </script> 


![this is how html format coming while loading menus]

來源

2013-07-30 Vandana

美國連鎖行業代碼 –

上面提到的我的代碼。請幫助 – Vandana

也許這就是問題，也許給我們你的ie版本，並嘗試檢查你的CSS –

嘗試這一點 - 在我們的例子中，我們顯示菜單在ul中，我們最初通過控件的style屬性隱藏它。完成頁面渲染和綁定jquery方法後，通過使用css或您的便利來顯示它。

<ul class="menu-hvr" id="jMenu" style="display:none"> 
      @if (!showUserMenu) 
      { 
       <li class="buttonFirstAll homebtn1"> 
        <a href="/sign-up">sign up</a> 
       </li> 
       <li class="homebtn2"> 
        <a href="/sign-in/?popup=true">sign in</a> 
       </li> 
      }........ 
    </ul>

來源

2014-09-20 11:42:01

加載Jmenu呈現問題

回答

相關問題