2

Bootstrap Responsive 的折叠 btn 的“显示”事件第一次未正确触发,也未将高度设置为“自动”。它在第一次扩展后每次都有效,但不是第一次。

<div class="navbar navbar-inverse navbar-fixed-top">
  <div class="navbar-inner">
    <div class="container">
      <a id="collapse-btn" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </a>
      <a class="brand" href="#">&nbsp;</a>
      <div class="nav-collapse">
        <ul class="nav pull-right" id="user-dropdown">
          <li>
            <form class="navbar-search" action="">
              <input type="text" class="search-query span3" placeholder="Search">
            </form>
          </li>
          <li class=""><a href="#"><i class="icon-list icon-white"></i> Categories</a></li>
          <li class=""><a href="#"><i class="icon-upload icon-white"></i> Upload</a></li>
          <li class="dropdown" id="dropdown-click-user">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-user icon-white"></i> Username <b class="caret"></b></a>
            <ul class="dropdown-menu" id="dropdown-menu-user">
              <li><a href="#">Action</a></li>
              <li><a href="#">Another action</a></li>
            </ul>
          </li>
        </ul>
      </div><!-- /.nav-collapse -->
    </div><!-- /.container -->
  </div><!-- /.navbar-inner -->
</div><!-- /.navbar -->

请参阅http://jsfiddle.net/PKDmn/

检查步骤:

  1. 确保屏幕宽度足够小,可以看到折叠图标。
  2. 单击折叠图标(右上角)
  3. 点击用户名下拉菜单(第一次不会展开)
  4. 关闭折叠菜单(右上角)
  5. 打开折叠菜单(右上角)
  6. 单击用户名下拉列表(应该从这里开始工作)

我需要它第一次和所有其他人一样工作。想法?

谢谢,蒂姆

4

0 回答 0