jquery - Twitter Bootstrap は、display:none の代わりに hide を使用します

Question

私は Twitter Bootstrap を使用してサイトを開発していますが、タブを非表示にするdisplay: none代わりに使用しているため、タブに問題があります。つまり、非表示のタブの iframe と位置要素で問題が発生します。

私の質問は、デフォルトの実装とは異なる方法でタブを非表示にするようにブートストラップを構成する方法はありますか?

Answer 1

上記のコメントで示唆されているように、可視性オプションを使用する必要があります。また、divがスペースを占有しているため、位置を変更する必要があります。タブを切り替えると、ページ上の別の場所に切り替わります。css変更の最終結果は次のようになります。

.tab-content > .tab-pane,
.pill-content > .pill-pane {
  visibility:hidden;
  position: absolute;
  width: 930px;
}

.tab-content > .active,
.pill-content > .active {
  display: inline;
  visibility:visible;
   position: absolute;
   width: 930px;

}

独自のソリューションに変更します。

Answer 2

同じ問題があり、タブ内の要素の幅を取得したかったのです。
タブが表示されているときにやりたいことをしたいかどうかはわかりませんが、タブをクリックして要素機能を取得するときに役立つと思います。

$('#mytab a[href="#tab2"]').on('shown.bs.tab', function (e) {
//the mytab is the id of your tab header and tab2 is 
the tab which is not active yet
});

これがあなたに役立つことを願っています