2012-12-02 36 views
4

我使用Twitter Bootstrap來開發一個站點,並且我遇到了這些選項卡,這是因爲它們使用的是display: none而不是隱藏選項卡。它導致隱藏標籤上的iframe和位置元素的問題。Twitter Bootstrap使用隱藏而不是顯示:none

我的問題是有沒有一種方法來配置引導程序隱藏標籤的方式不同於默認實現?

+0

「* ...而不是隱藏標籤..」,「你介意解釋嗎? – Alexander

+0

找到bootstrap設置'display:none;',並設置'visibility:hidden;'代替。你的瀏覽器的網絡檢查員應該很容易找到引導程序在哪裏設置display:none。 – Lee

+0

幾乎,除了改變它,它永遠不會顯示 –

回答

3

正如上面評論中所建議的那樣,您必須使用可見性選項。此外,位置必須改變,因爲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; 

} 

修改爲您自己的解決方案。

0

我有同樣的問題,我想獲得標籤內元素的寬度。
我不知道,如果你想,做你想做的時候顯示與否的標籤做什麼,但我想這可能會幫助你當你點擊選項卡,並獲得要素的功能:

$('#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 
}); 

希望這可以幫助你

相關問題