3

サブメニューがある場合、それらはデフォルトで表示され、スクロールしてスクロールする必要があります。私が欲しいものを見てください。ただし、これは Bootstrap の以前のバージョン用です。私は 2.1.1 を考え出していますが、これは Bootstrap のデフォルト機能であるべきだと思います (新しいバージョンでは多くのことが変更されています)。

Plzはここを見てください：

http://jsfiddle.net/nczJF/

関連するサブメニューをクリックするだけでメインメニューとサブメニューが表示されるようなメニュー動作を探しています。私はたくさん検索しましたが、それらはすべて Bootstraps の以前のバージョンのものです。では、専門家のアドバイスをくれる人はいますか?

4

1 に答える 1

3

http://jsfiddle.net/nczJF/39/

これは、最新バージョンのブートストラップを使用します。唯一の違いは CSS で、JS は同じです。

bootstrap-responsive.css で、以下を削除display: blockします (表示なしに切り替えないでください)。

.nav-collapse .dropdown-menu {
  position: static;
  top: auto;
  left: auto;
  float: none;
  display: block; /* remove this line! */
  max-width: none;
  padding: 0;
  margin: 0 15px;
  background-color: transparent;
  border: none;
  -webkit-border-radius: 0;
     -moz-border-radius: 0;
          border-radius: 0;
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;
}

同じファイルの下部に向かって、次のように変更height: 0しheight: autoます。

.nav-collapse,
.nav-collapse.collapse {
  height: auto; /* instead of 0 */
  overflow: hidden;
 }

次に、デフォルトの展開ビューを修正するために、html を変更します。collapsedクラスを折りたたみボタンに追加します。

<button type="button" class="btn btn-navbar collapsed" data-toggle="collapse" data-target=".nav-collapse">

また変更

<div class="nav-collapse">

に

<div class="nav-collapse collapse" style="height: 0px; ">

これは JS を編集することでより優雅になる可能性がありますが、これは別のファイルを変更しなくても機能します。

ここでこの機能の統合を推進しています: https://github.com/twitter/bootstrap/issues/5606

于 2012-10-30T18:00:38.960 に答える