Bootstrap Tab Pane滑动效果

Question

好的，很不言而喻，但是我无法弄清楚它是如何完成的，也找不到任何资源...

我有以下简单的tab-pane列表：

  tab-pane fade in active

但我不需要fade过渡。 但是最好是从右侧slide一张。 有这样的事吗？ 我该怎么做？

Answer 1

我创建了那个小js函数：

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {    
    var target = $(this).attr('href');

    $(target).css('left','-'+$(window).width()+'px');   
    var left = $(target).offset().left;
    $(target).css({left:left}).animate({"left":"0px"}, "10");
})

您只需要将此小CSS添加到标准Bootstrap中，标准HTML标记就保持不变：

.tab-content .tab-pane {    
    position: relative;
}

看看这个bootply，看看它是否是您想要的。

引导