Zurb Foundation 5 toggle-topbar无效

Ale*_*ano 21 zurb-foundation

刚刚切换我的rails项目来测试Zurb Foundation 5,现在切换顶部栏菜单无效.

当视口很小时,顶部栏菜单项会消失,菜单图标会像以前一样显示,但是当我点击菜单图标时,什么都没有.

我有以下代码来显示顶栏菜单.

<nav class="top-bar">
  <ul class="title-area">
    <li class="name"></li>
    <li class="toggle-topbar menu-icon">
      <a>{href: "#"}
        <span>Menú</span></a>
    </li>
  </ul>
  <section class="top-bar-section">
    <ul class="left">
      <li>
        <a class="i fi-home">{href: "/ui/home"}
          &nbsp;Inicio</a></li>
      <li>
        <a>{href: "/ui/wine_reviews"} Críticas de Vinos</a></li>
      <li>
        <a>{href: "/ui/wine_tastings"} Catas y Maridajes</a></li>
      <li>
        <a>{href: "/ui/blogs"} Noticias</a></li>
    </ul>
    <ul class="right">
      <li>
        <a>{href: "#"}
          <i class="fi-lock"></i>
          &nbsp;Club TastaVi</a></li>
    </ul>
  </section>
</nav>
Run Code Online (Sandbox Code Playgroud)

这是我网格中包含的顶栏菜单.

小智 15

顶部栏我遇到了同样的问题.在将zurbs代码与我的比较后,我注意到了差异.

<nav class="top-bar" data-topbar>
Run Code Online (Sandbox Code Playgroud)

我错过了数据顶部栏.添加后我的topbar开始正常工作.


小智 5

问题似乎出现在Foundation.topbar.js文件中.以下代码部分

breakpoint : function () {
        return matchMedia(Foundation.media_queries['medium']).matches;
    }
Run Code Online (Sandbox Code Playgroud)

需要改为

breakpoint : function () {
        return !matchMedia(Foundation.media_queries['topbar']).matches;
    }
Run Code Online (Sandbox Code Playgroud)

  • 它能为您提供帮助吗?因为我按照建议将`<nav class ="top-bar">`更改为`<nav class ="top-bar"data-topbar>`来轻松修复它. (4认同)