Foundation 6 Off Canvas，我应该在哪里放置菜单内容？

我下面基金会6文档创建关帆布菜单：http://foundation.zurb.com/sites/docs/off-canvas.html Foundation 6 Off Canvas，我应该在哪里放置菜单内容？

这里是我做过什么：

<body> 
    <div class="off-canvas-wrapper"> 
    <div class="off-canvas-wrapper-inner" data-off-canvas-wrapper> 

     <div class="off-canvas position-left" id="offCanvasLeft" data-off-canvas> 
     <ul class="vertical menu"> 
      <li>test1</li> 
      <li>test2</li> 
      <li>test3</li> 
      <li>test4</li> 
     </ul> 
     </div> 

     <div class="off-canvas position-right" id="offCanvasRight" data-off-canvas 
      data-position="right"></div> 

     <div class="off-canvas-content" data-off-canvas-content> 
     <div class="title-bar"> 
      <div class="title-bar-left"> 
      <button class="menu-icon" type="button" data-toggle="offCanvasLeft"></button> 
      <span class="title-bar-title">Zurb</span> 
      </div> 

      <div class="title-bar-right"> 
      <button class="menu-icon" type="button" data-toggle="offCanvasRight"></button> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 
</body>

但是当我打开菜单，这里是我得到：

我可以滚动它并看到我的test1/2/3/4，但为什么我会得到这个结果呢？

我要的是一样的东西，我们可以在基础文档时看到的“切换关画布”点击

难道我把我的表错了地方？我敢肯定我的框架是最新的，并且我一直都在文档一步一步，但它不会给尽可能多的信息，我想有

来源

2016-02-27 Charrette

你必须在菜单中右地点和您的示例等同于Foundation 6文档中提供的示例。

这似乎是一个设计问题，其中关闭画布菜单的长度取决于内容的大小。由于页面上没有内容，菜单的高度与菜单栏相等。

只要填充off-canvas-content，菜单应按预期显示。

点击Here进行演示。

来源

2016-02-27 16:12:15 Yass

没错，谢谢:) – Charrette

谢谢你分享你的代码。它与ZURB为Foundation 6起始页面的示例略有不同。 ZURB使用“包装”而不是“包装”。我改变了我的代码以匹配你的和瞧！他们的教程是：

http://foundation.zurb.com/sites/docs/v/5.5.3/components/offcanvas.html

此致：

<div class="off-canvas-wrapper"> 
<div class="off-canvas-wrapper-inner" data-off-canvas-wrapper>

ZURB：

<div class="off-canvas-wrap" data-offcanvas> 
<div class="inner-wrap">

来源

2017-03-09 21:33:44 Lisa

Foundation 6 Off Canvas，我应该在哪里放置菜单内容？

回答

相关问题