0

Javascript を記述せず、Twitter Bootstrap の「タブ可能なタブ」を使用せずに、各 data-toogle="Tab" で NavBar を指定しました。

 <ul class="tabnavcenter">
      <li class="active"><a href="#home" data-toggle="tab">**Name 1**</a></li>
      <li><a href="#tab2" data-toggle="tab">Name 2</a></li>
      
 </ul>

...そして、次を使用してその上のコンテンツを返しました:

<div class="tab-content">
  <div class="tab-pane active" id="home">
   **Content 1** 
  </div>
</div>

素晴らしく簡単で完璧に機能しますが、タブの内容を 2 つの個別の DIV に戻すためにハックする必要があります。Twitter のタブの API は次のとおりです。

/* TAB DATA-API
   * ============ */

 $(function () {
   $('body').on('click.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
     e.preventDefault()
   $(this).tab('show')
   })
  })

 }(window.jQuery);

これがまさに私がやろうとしていることです:

ここに画像の説明を入力

...つまり、#tab 1 をクリックすると、その上下にコンテンツが表示されます。

ありがとうございました。

4

0 に答える 0