Foundation-4 折叠菜单不出现答案

【问题标题】：Foundation-4 Collapsed menu does not appearFoundation-4 折叠菜单不出现
【发布时间】：2013-04-21 20:00:24
【问题描述】：

我直接使用 Foundation 文档中的代码，但不知何故它不适合我。

这就是我编写代码的方式：

  <nav class="top-bar">
    <ul class="title-area">
        <li class="toggle-topbar menu-icon"><a href="#"><span>MENU</span></a></li>
    </ul>
    <section class="top-bar-section" style="left: 0%;">
    <!-- Left Nav Section -->
        <ul class="left">
          <li class="active"><a href="#">Main Item 1</a></li>
          <li class="active"><a href="#">Main Item 1</a></li>
          <li class="active"><a href="#">Main Item 1</a></li>
         </ul>
    </section>
</nav>

当我缩小浏览器窗口并达到“小”窗口大小时，菜单会从页面上消失。知道我做错了什么吗？

【问题讨论】：

需要查看css，因为我认为问题出在那儿。
CSS 未被修改，它是 Foundation-4 包的一部分。你有Foundation 4吗？
我什至不知道Foundation 4是什么。你需要使用它吗？因为只要 jQuery 3-4 行就可以完成...

标签： css responsive-design zurb-foundation

【解决方案1】：

@Xarcell，我不是出于这个原因使用 Foundation。我正在建立一个响应式网站，这就是我使用 Foundation 的原因。提到的问题只是我在这个框架中遇到的问题之一。顺便说一句：Foundation-4 是 Zurb 的响应式网页设计框架。

@Dawood Awan、jQuery 和 Foundation 已正确链接。其余的功能都运行良好，所以我知道它的链接。我面临的问题是菜单本身。

我自己回答这个问题，因为我解决了这个问题。

文档中提到下面提到的代码是可选的，因此我没有使用它。但似乎我必须使用它（即使它是空白的）才能使我的菜单正常工作。

<li class="name">
  <h1></h1>
</li>

希望这可以帮助其他有类似问题的人。

【讨论】：

【解决方案2】：

我不知道这些代码行的问题是什么。但这里可能会出现一些问题：

您尚未将 jQuery 文件链接到页面。
您尚未将 zurb 基础文件链接到页面。
如果您同时应用了这两种方法，请转到此处：http://foundation.zurb.com/templates.php 下载模板查看他们的代码并与您的代码进行比较以检查错误。

【讨论】：