Zurb Foundation 顶部栏下拉菜单和菜单不起作用答案

【问题标题】：Zurb Foundation Top-bar Dropdown and Menu not workingZurb Foundation 顶部栏下拉菜单和菜单不起作用
【发布时间】：2015-03-05 19:05:55
【问题描述】：

<nav class="top-bar" data-topbar role="navigation">
  <ul class="title-area">
    <li class="name">
      <h1><a href="#">Welcome</a></h1>
    </li>
     <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
    <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>
  </ul>

  <section class="top-bar-section">
    <!-- Right Nav Section -->
    <ul class="right">
      <li class="has-dropdown">
        <a href="#">Hello, User</a>
        <ul class="dropdown">
          <li><a href="#">Settings</a></li>
          <li class="active"><a href="#">Log Out</a></li>
        </ul>
      </li>
    </ul>

  </section>
</nav>

我有两个问题。

下拉菜单不能全屏显示。悬停/单击“您好，用户！”对我没有任何作用。当我检查元素时，似乎下拉菜单被赋予了 -100% 的定位。

section class="top-bar-section" style="left: -100%;

2.当我调整屏幕大小时，会显示菜单文本和图标，但“您好，用户”会出现在其下方，而不是仅在您单击“菜单”时才会出现。点击菜单什么都不做。

任何帮助将不胜感激！

【问题讨论】：

标签： html css zurb-foundation

【解决方案1】：

您的基础代码是 100% 正确的。看起来好像您缺少下拉列表所依赖的 JQuery，或者它没有正确触发。请调查一下，如果您仍然有问题，请发布您的整个代码页面，包括头部标签。

【讨论】：

我的标题中缺少 jquery！谢谢！