Foundation 5响应式Offcanvas菜单

Question

我正在尝试使用基础5来创建自己的画布响应式菜单。

我希望能够显示正常菜单，直到达到某个断点，然后使用非画布。但只需使用一个菜单。有什么想法吗？

<div class="off-canvas-wrap">
<div class="inner-wrap">
<nav>
<section class="small-left">
<a  class="left-off-canvas-toggle menu-icon"><span></span></a>
</section>
<ul>
<li><a href="">Home</a></li>
<li><a href="">Portfolio</a></li>
<li><a href="">Website Quotes</a></li>
<li><a href="">Open Cart Templates</a></li>
<li><a href="">Responsive HTML Templates</a></li>
<li><a href="">Tutorials</a></li>
<li><a href="">Contact</a></li>
<li><a href="">About</a></li>
</ul>
</nav>
</div>
</div>

Answer 1

如果您想同时只显示一个菜单，请参阅Hide by Screen Size。

例如，对于普通菜单使用.hide-for-small类，对于非画布菜单使用.hide-for-medium，.hide-for-large类。