mmenu滑出菜單不起作用

我一直在尋找一種方法來將滑出菜單整合到我的網站中，但各種javascript插件都失敗了（我對網頁設計相當陌生）。我似乎無法讓這個工作正常。我最近發佈了一個關於一個側面菜單的結果，但是在手機屏幕上顯示空白。現在我正在嘗試我的運氣在一個mmenu http://mmenu.frebsite.nl/examples.html我已經發布了我的html下面，並試圖修復它整整一天，現在仍然無法讓它工作！你可以看到什麼是目前顯示出來的網站放在這裏http://jpst.it/zQtF mmenu滑出菜單不起作用

<!doctype html> 
<!--[if lt IE 7]> <html class="ie6 oldie"> <![endif]--> 
<!--[if IE 7]> <html class="ie7 oldie"> <![endif]--> 
<!--[if IE 8]> <html class="ie8 oldie"> <![endif]--> 
<!--[if gt IE 8]><!--> <html class=""> 
<!--<![endif]--> 
<head> 
<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<title>Untitled</title> 
<link href="boilerplate.css" rel="stylesheet" type="text/css"> 
<link href="style.css" rel="stylesheet" type="text/css"> 
<link type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jQuery.mmenu/5.3.1/css/jquery.mmenu.css" rel="stylesheet"> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery.mmenu/5.3.1/js/jquery.mmenu.min.js"></script> 
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script> 
<script type="text/javascript"> 
     jQuery(document).ready(function($) { 
      $("#menu").mmenu({}); 
      var API = $("menu").data("mmenu") 

      $("menu-button").click(function() { 
       API.open(); 
     }); 
    }); 
    </script> 
</head> 
<body> 
    <div class="container"> 
     <div class="header"> 
     <div class="logo"></div> 
     <button id="menu-button"><a href="#menu">menu</a></button> 
</div>  
    <div class="content"> 
     <div class="posts">1</div> 
     <div class="posts">2</div> 
     <div class="posts">3</div> 
     <div class="posts">4</div> 
     <div class="posts">5</div> 
    </div> 
    <div class="footer">asdfafdsasfsdasfad</div> 
    </div> 
    <nav id="menu"> 
     <ul> 
      <li><a href="/">Home</a></li> 
      <li><a href="/about">About us</a> 
       <ul> 
        <li><a href="/about/history">History</a></li> 
        <li><a href="/about/team">The team</a></li> 
        <li><a href="/about/address">Our address</a></li> 
       </ul> 
      </li> 
      <li><a href="/contact">Contact</a></li> 
     </ul> 
     </nav> 
</body> 
</html>

來源

2015-06-29 Bennypea

有幾件事情你的代碼錯誤，並沒有你的樣式表我不能真的確定你的問題是什麼，但我相信你的問題從包含mmenu JavaScript文件時未包含jQuery的事實開始。所以切換行代碼：

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script> 
<link type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jQuery.mmenu/5.3.1/css/jquery.mmenu.css" rel="stylesheet"> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery.mmenu/5.3.1/js/jquery.mmenu.min.js"></script> 
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

這應該是足以令它的功能，但要記住，＃符號在JavaScript中，當你引用的ID。另外，記住你的所有javascript語句結尾處的分號。

來源

2015-06-29 00:42:52 Youppi3

mmenu滑出菜單不起作用

回答

相關問題