Zurb基金会顶栏下拉菜单无效

时间:2015-03-05 19:05:55

标签: html css zurb-foundation

<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>

我有两个问题。

  1. 下拉列表无法全屏显示。徘徊/点击“你好,用户!”#39;对我没有任何帮助。当我检查元素时,看起来下拉的定位为-100%。
  2.   

    section class =&#34; top-bar-section&#34; style =&#34; left:-100%;

    2.当我调整屏幕大小时,会显示菜单文本和图标,但是“Hello,User&#39;出现在它下面而不是仅在单击“菜单”时出现。单击菜单不执行任何操作。

    任何帮助将不胜感激!

1 个答案:

答案 0 :(得分:1)

您的粉丝代码100%正确无误。看起来好像你错过了下拉列表依赖的JQuery,或者它没有正确触发。请仔细研究一下,如果您的整个代码页(包括头标记)仍有问题。