0

私は多くのブートストラップドロップダウンの質問を検索しましたが、私と同じ特定の問題を持つものは見つかりませんでした!

BootstapDropdownNavbarサブメニューに問題があります...

Bootstrap(v2.0.3)の最新リリースを使用しています

これで、すべてが標準のデスクトップビューで正常に機能しているように見えますが、ブラウザの幅を縮小すると(または、iPhone / iPadで表示すると)、サブメニューが正しく機能しません。

TESTSITEの私のテストサイトにアクセスするだけの場合に最適です

ご覧のとおり、「ポイントテーブル」ドロップダウンはデスクトップビューでは問題ありませんが、「モバイル」ビューでは問題があります。「ポップアップ」は機能せず、サブメニューは永続的に表示されます。

私はサンプルコードに正確に従っていると思います(「アップグレードドキュメント」を介して、例が示す方法とは異なる方法で「caret」を実装する必要があることを理解する以外)

これが私の現在のコードです:

<div class="navbar navbar-fixed-top">
  <div class="navbar-inner">
    <div class="container">
      <a 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="#"><img alt="F1Stockcars.com" src="../assets/img/logo.png"></a>
      <div class="nav-collapse">
        <ul class="nav">

          <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
            Points Tables
            <span class="caret"></span>
            </a>
            <ul class="dropdown-menu">
            <li><a href="#">National Points</a></li>
            <li><a href="#">World Championship Qualifying</a></li>
            <li><a href="#">Track Championships</a></li>
            </ul>
          </li>
          <li><a href="#">Meeting Results</a></li>
          <li><a href="#">Drivers</a></li>
          <li><a href="#">Final Winners</a></li>
          <li><a href="#">Top Scorers by Meeting</a></li>
          <li><a href="#">Highest Scores</a></li>
          <li><a href="#">Back to F1Stockcars.com</a></li>
        </ul>
      </div><!--/.nav-collapse -->
    </div>
  </div>
</div>

何が間違っているのか理解できません。ページはサンプルページの1つとして開始されているため、必要なすべてのコードが必要です。実際には作成しないjavascriptも含めて、ブートストラップフレームワーク全体をサーバーに追加しました。必要です。

私はこれに完全に困惑しているので、どんな助けもいただければ幸いです

私は非常に基本的なスキルしか持っていないので、シンプルにしてください

どうもありがとう-アデ

4

2 に答える 2

2

変更してみてください:

<div class="nav-collapse">

に:

<div class="nav-collapse collapse">

これで問題は解決しました。http://twitter.github.com/bootstrap/components.html#navbar (レスポンシブ Navbar セクションまでスクロールします)のブートストラップ サイトの例で取り上げました。

于 2012-11-25T00:36:50.610 に答える
0

bootstart-collapse.js を含めるのを忘れていませんか?

追加すればうまくいくはずです。

于 2012-07-17T09:15:22.743 に答える