Fondation 4 通过顶栏导航不呈现下拉菜单答案

【问题标题】：Fondation 4 navigation via top-bar not rendering dropdownFondation 4 通过顶栏导航不呈现下拉菜单
【发布时间】：2014-07-16 14:16:27
【问题描述】：

使用 Foundation 4，导航栏无法呈现下拉项目，即使它们已在 html 中列出

    <li class="has-dropdown"><a href="/#">Gallery</a>
      <ul class="dropdown">
        <li><a href="/galleria_categoris/1">liposuzione</a></li>
      </ul>
    </li>

这个jsfiddle有相关代码。我认为对 css 文件和 js 的引用是正确的（在 jsfiddle 中，顶栏脚本从第 466 行开始）；相同的文件在另一个功能实例中使用...

【问题讨论】：

标签： javascript jquery responsive-design zurb-foundation

【解决方案1】：

下拉标题必须采取类不点击才能弹出项目

<li class="has-dropdown  not-click">

不在文档 AFAICT...

【讨论】：

是的，这有点令人困惑。对我来说 has-dropdown 应该意味着下拉菜单处于活动状态......此外，如果一个人想要保持相同的风格，但如果删除锚标签，你正在处理不同的风格。可以更好地记录，也许有 has-dropdown p 或 span 继承 has-dropdwon 样式...

【解决方案2】：

这是一个带有下拉菜单的 jsfiddle with the foundation 4 工作顶栏。

你的 html 结构是正确的.. 它只是你的小提琴没用..

 <li class="has-dropdown"><a href="#">Main Item 3</a>

    <ul class="dropdown">

      <li><a href="#">Dropdown Level 1b</a></li>
      <li><a href="#">Dropdown Level 1c</a></li>
      <li class="divider"></li>
      <li><a href="#">Dropdown Level 1d</a></li>
      <li><a href="#">Dropdown Level 1e</a></li>
      <li><a href="#">Dropdown Level 1f</a></li>

    </ul>
  </li>

【讨论】：