2013-10-30 60 views
0

我正在嘗試Mega菜單示例,爲此我包含了各種js文件。 並試圖獲得大型菜單。 我的代碼如下。代碼只是打印我的列表itms。它不顯示菜單。巨型菜單示例不起作用

請看下面的代碼有什麼問題。

<%@page contentType="text/html" pageEncoding="UTF-8"%> 
    <!DOCTYPE html> 
    <html> 
     <head> 
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
      <script type='text/javascript' src='js/jquery-1.9.1.js'></script> 
      <script type='text/javascript' src='js/jquery.hoverIntent.minified.js'></script> 
      <script type='text/javascript' src='js/jquery.dcmegamenu.1.2.js'></script> 
      <link href="css/megamenu.css" rel="stylesheet" type="text/css" /> 
      <title>JSP Page</title> 
      <script> 
       $('#mega-menu').dcMegaMenu({ 
        rowItems: '1', 
        speed: 'fast' 
       }); 
      </script> 
     </head> 
     <body> 
      <ul id="mega-menu"> 
       <li><a href="dashboard">Dashboard</a></li> 
       <li> <a href="ShowProduct">Product</a> </li> 
       <li><a href="ShowColors">Colors</a></li> 
       <li> <a href="ShowSizes">Sizes</a> </li> 
       <li><a href="ShowPModelNO">Product Model No</a></li> 
       <li><a href="ShowProductType">Product Types</a> </li> 
       <li> <a href="ShowSupplier">Supplier</a> </li> 
       <li><a href="ShowCustomer">Customer</a> </li> 
       <li><a href="#">Products</a> 
        <ul> 
         <li><a href="#">Mobile Phones &#038; Accessories</a> 
          <ul> 
           <li><a href="#">Product 1</a></li> 
           <li><a href="#">Product 2</a></li> 
           <li><a href="#">Product 3</a></li> 

          </ul> 
         </li> 
        </ul> 
       </li> 
      </ul> 
     </body> 
    </html> 

編輯:這是demo

回答

0

您實際上添加了錯誤的文件。請結帳這個的jsfiddle:

http://jsfiddle.net/Jd5PS/1/

的代碼仍然是相同的,但我用的文件是不同的:

$('#mega-menu').dcMegaMenu({ 
    rowItems: '1', 
    speed: 'fast' 
}); 
+0

這裏受審。這是行不通的[Demo](http://jsfiddle.net/Jd5PS/) –

+0

jsfiddle中缺少一個庫。請正確包含菜單插件。檢查控制檯,你會看到* Uncaught TypeError:Object [object Object] has no method'dcMegaMenu'* – Krasimir

+0

再次檢查我的答案。我發現了什麼問題。 – Krasimir