基础6关闭画布菜单

我想添加一个画布菜单到我的网站，但我是一个基础初学者，我不知道如何使用它。我已阅读基金会网站的文档和我一直在寻求构建块，但我不能添加过canvas.This是我的HTML：基础6关闭画布菜单

<div class="off-canvas-wrapper"> 
<div class="off-canvas-wrapper-inner" data-off-canvas-wrapper> 
    <div class="off-canvas position-left" id="offCanvas" data-off-canvas> </div> 
    <div class="title-bar"> 
     <div class="title-bar-left"> 
      <button class="menu-icon" type="button" data-open="offCanvas"></button> 
      <span class="title-bar-title">Title</span> 
     </div> 
    </div> 
    <div class="off-canvas-content" data-off-canvas-content></div> 
</div>

我按开放关闭帆布按钮，但我的菜单不appear.I都用这个文库

<link rel="stylesheet" href="style/foundation.css"/> 
<script src="style/foundation.js"></script> 
<script src="style/js/app.js"></script> 
<script src="style/css/app.css"></script> 
<script src="style/bower_components/foundation-sites/js/foundation.core.js"></script> 
<script src="style/bower_components/foundation-sites/js/foundation.dropdownMenu.js"></script> 
<script src="style/bower_components/jquery/dist/jquery.js"></script> 
<script src="style/bower_components/foundation-sites/js/foundation.util.keyboard.js"></script> 
<script src="style/bower_components/foundation-sites/js/foundation.util.box.js"></script> 
<script src="style/bower_components/foundation-sites/js/foundation.util.nest.js"></script> 
<script src="style/bower_components/what-input/what-input.js"></script> 
<script src="style/bower_components/foundation-sites/js/foundation.offcanvas.js"></script>

感谢

来源

2016-02-24 Skurt

您可以创建一个小提琴吗？ –

拷贝：

<div class="off-canvas-wrapper"> 
    <div class="off-canvas-wrapper-inner" data-off-canvas-wrapper> 
    <div class="off-canvas position-left" id="offCanvas" data-off-canvas>MY OFF CANVAS</div> 
    <div class="off-canvas-content" data-off-canvas-content> <button type="button" class="button" data-toggle="offCanvas">Open Menu</button></div> 
    </div> 
    </div>

我希望它能帮助！在与“打开菜单” - 键你把孔页......股利

来源

2016-02-24 21:14:02

一些步骤，以帮助您：

好像你已经包括了所有的元素自己。这是一个不好的做法，我建议你最好包括在一个文件中的所有基金会的JS的（就像他们交给你，当你下载 here。
基础的新的安装，请确保您基金会的结构后去。从文档，对于脱离Canvas元素的结构是：

完整链接的文档是here

<body> 
    <div class="off-canvas-wrapper"> 
    <div class="off-canvas-wrapper-inner" data-off-canvas-wrapper> 
     <div class="off-canvas position-left" id="offCanvas" data-off-canvas> 

    <!-- Close button --> 
    <button class="close-button" aria-label="Close menu" type="button" data-close> 
     <span aria-hidden="true">&times;</span> 
    </button> 

    <!-- Menu --> 
    <ul class="vertical menu"> 
     <li><a href="#">Foundation</a></li> 
     <li><a href="#">Dot</a></li> 
     <li><a href="#">ZURB</a></li> 
     <li><a href="#">Com</a></li> 
     <li><a href="#">Slash</a></li> 
     <li><a href="#">Sites</a></li> 
    </ul> 

    </div> 

     <div class="off-canvas-content" data-off-canvas-content> 
     <!-- Page content --> 
     </div> 
    </div> 
    </div> 
</body>

来源

2016-11-15 07:47:51 elicohenator

基础6关闭画布菜单

回答

相关问题