Question

在选项卡上更改内容没有淡出效果。我添加了类淡入淡出，但我得到了相同的结果。有什么帮助吗？

这是实时预览： http://jsfiddle.net/DesignPuma/zVgX5/2/

HTML：

<div class="btn-group" id="myTab" data-toggle="buttons-radio">
    <a class="btn active" href="#popularPosts" data-toggle="tab"><i class="icon-star"></i></a>
    <a class="btn" href="#recentPosts" data-toggle="tab"><i class="icon-tags"></i></a>
</div>

<div id="sidebar-tabs" class="tab-content">
    <div class="tab-pane fade in active" id="popularPosts">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
    </div>
    <div class="tab-pane fade" id="recentPosts">
        <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
    </div>
</div>

JavaScript的：

$('#myTab a').click(function (e) {
  e.preventDefault();
  $(this).tab('show');
})

由于

Answer 1

你必须包含bootstrap-transition.js才能获得淡入淡出效果。

http://twitter.github.io/bootstrap/assets/js/bootstrap-transition.js

使用按钮选项卡时，引导程序内容不会随更改而淡入

1 个答案: