2

Bootstrap Responsive からの折りたたみボタンの "shown" イベントが、最初は正しく起動せず、高さが "auto" に設定されていません。最初の展開後は毎回機能しますが、初めては機能しません。

<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