0

navbar で data-toggle="tab" を指定して、bootstrap.js タブを有効にしています。

<li><a href="#tab2" data-toggle="tab">Look Inside</a></li>

次に、これらのタブのコンテンツを次のように返します。

<div class="tab-content">
<div class="tab-pane active" id="tab1">Content
</div>
</div>

同じコンテンツをページ上の 2 つの別々の場所に、それぞれ別々の div に戻す方法を考えています。今のところ、私は追加します：

...最初の div が閉じられた後 (上部のコンテンツと下部のコンテンツの間に水平なナビゲーション バーがあるため、閉じなければなりません)、コンテンツが返されません。

「タブコンテンツ」を別のものと呼んでも、Twitterのブートストラップ機能を維持できる方法はありますか?

タイ

4

1 に答える 1

0

これを行うには 2 つの方法があります。1 つは純粋な CSS で、ブートストラップ ドロップダウンが任意のメニューを開くという事実を利用しています。例えば：

myvew.html.haml

%ul.nav.nav-pills
  %li.dropdown
    %a.dropdown-toggle{"data-toggle" => "dropdown"}
      Foo
      %b.caret
    %ul.dropdown-menu{style: "position: relative; top: -10px;"}
      %li Bar1
    %ul.dropdown-menu
      %li Bar2

これにより、「Foo」リンクをクリックすると、「Bar1」と「Bar2」の両方が表示されます。

ただし、私はこのアプローチを好む傾向があります。イベント リスナーを「Foo」リンクに登録すると、イベント リスナーがターゲットに対して.show()orを切り替えます。.hide()div

$(document).ready(function() {
  $('#myclickdiv').click(function() {
    $('.mydivs').collapse("show");
  });
});
于 2012-05-17T21:52:45.973 に答える