2014-10-27 2 views
1

Я использую последнюю версию Foundation, чтобы добавить меню навигации вне холста. Это мой тест кодовая страницы для работы с фундаментом совсем холста:Почему в моем проекте не работает zurb Foundation off-canvas?

<html class="no-js" lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
    <title>Foundation | Welcome</title> 
    <link rel="stylesheet" href="css/foundation.css" /> 
    <script src="js/vendor/modernizr.js"></script> 
    </head> 
    <body> 
     <div class="off-canvas-wrap show-for-small-only"> 
      <div class="inner-wrap"> 
       <nav class="tab-bar show-for-small-only"> 
        <section class="tab-bar-section"> 
         <h1 class="title">Foundation</h1> 
        </section> 
        <section class="right-small"> 
         <a class="right-off-canvas-toggle menu-icon"><span></span></a> 
        </section> 
       </nav> 
       <aside class="right-off-canvas-menu"> 
        <ul class="off-canvas-list"> 
         <li><label>Users</label></li> 
         <li><a href="#">Hari Seldon</a></li> 
        </ul> 
       </aside> 
       <a class="exit-off-canvas"></a> 
      </div> 
     </div> 
     <div> 
      <h1 class="show-for-small-only">Phone</h1> 
      <h1 class="show-for-medium-only">Medium</h1> 
      <h1 class="show-for-large-only">Large</h1> 
      Content Goes here 
     </div> 

     <script src="js/vendor/jquery.js"></script> 
     <script src="js/foundation.min.js"></script> 
     <script src="js/foundation/foundation.offcanvas.js"></script> 
     <script> 
      $(document).foundation(); 
     </script> 
    </body> 
</html> 

Я не теперь, почему до сих пор не работаю. Каковы мои проблемы с кодом?

ответ

3

В файле, который вы скопировали из the documentation, отсутствует атрибут данных data-offcanvas для инициализации в примере. Похоже, я должен представить PR, чтобы это исправить.

<div class="off-canvas-wrap show-for-small-only" data-offcanvas> 

JSFiddle вашего кода: http://jsfiddle.net/5wzutp1g/

+1

Он работал, спасибо. – Unique

+1

@Unique Добро пожаловать, спасибо за верх. Вам может быть интересно узнать, что я отправил PR для исправления документов: https://github.com/zurb/foundation/pull/5977 –

Смежные вопросы