Twitter Bootstrap 使用 hide 而不是 display:none

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
});

希望这对你有帮助