Foundation 6 Top Bar下拉菜单无法正常工作

时间:2017-01-31 20:46:27

标签: zurb-foundation

我直接从他们的网站https://foundation.zurb.com/sites/docs/top-bar.html复制了基础导航栏语法,并且下拉菜单功能似乎无法正常工作

以下是代码:

<div class="top-bar">
  <div class="top-bar-left">
    <ul class="dropdown menu" data-dropdown-menu>
      <li class="menu-text">Site Title</li>
      <li>
        <a href="#">One</a>
        <ul class="menu vertical">
          <li><a href="#">One</a></li>
          <li><a href="#">Two</a></li>
          <li><a href="#">Three</a></li>
        </ul>
      </li>
      <li><a href="#">Two</a></li>
      <li><a href="#">Three</a></li>
    </ul>
  </div>
  <div class="top-bar-right">
    <ul class="menu">
      <li><input type="search" placeholder="Search"></li>
      <li><button type="button" class="button">Search</button></li>
    </ul>
  </div>
</div>

这就是它的样子 enter image description here

2 个答案:

答案 0 :(得分:4)

确保初始化基础:

$(document).foundation();

答案 1 :(得分:1)

我有同样的问题 -

这似乎是Foundation 6.2~6.4的一个已知问题 - 至少对于使用foundation-rails gem的Rails应用程序而言。

修复方法是更新foundation_and_overrides.scss包含顺序,移动

@include foundation-dropdown-menu;

here

的底部