如何在＆amp;中淡出标签推出Twitter Bootstrap框架？

Question

jQuery UI可以选项初始化选项卡，选项卡设置为淡入/淡出，如下所示：

$(".selector").tabs({ fx: { opacity: 'toggle' } });

Twitter Bootstrap框架选项卡是否可以类似？

Answer 1

对于Bootstrap 2和3，您只需为.tab-pane个元素添加一个fade类，并加载bootstrap-transition.js。根本不需要编写一行自己的JavaScript代码。

<div class="tab-content">
  <div class="tab-pane fade in active" id="home">...</div>
  <div class="tab-pane fade" id="profile">...</div>
  <div class="tab-pane fade" id="messages">...</div>
  <div class="tab-pane fade" id="settings">...</div>
</div>

来自the official Twitter Bootstrap documentation的代码示例。

Answer 2

不，但您可以添加自己的jsFiddle

$('.tabs').tabs()
    .bind('change', function (e) {
        $(this).next().hide().fadeIn();
    });