Show/hide 个标签，从右到左

Question

晚安！我有标签。

$(".tab_item").not(":first").hide();
$(".wrapper .tab").click(function() {
 $(".wrapper .tab").removeClass("active").eq($(this).index()).addClass("active");
 $(".tab_item").hide().eq($(this).index()).fadeIn()
}).eq(0).addClass("active");

.wrapper .active { color: red; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper">
    <div class="tabs">
        <span class="tab">Вкладка 1</span>
        <span class="tab">Вкладка 2</span>
        <span class="tab">Вкладка 3</span>        
    </div>
    <div class="tab_content">
        <div class="tab_item">Содержимое 1</div>
        <div class="tab_item">Содержимое 2</div>
        <div class="tab_item">Содержимое 3</div>
    </div>
</div>

但它们显示为 "fadeIn"，隐藏为 "fadeOut"。我想让它们从右边显示（在 animate.css 中是 class "fadeInRightBig"）并隐藏到左边（在 animate.css 中是 class "fadeOunLeftBig").感谢您的帮助！

Answer 1

这就是你想要的吗？

http://codepen.io/Himechi90/pen/LpjReE

<div class="tab_content">
    <div class="tab_item animated fadeOutLeftBig">Содержимое 1</div>
    <div class="tab_item animated fadeOutLeftBig">Содержимое 2</div>
    <div class="tab_item animated fadeOutLeftBig">Содержимое 3</div>
</div>

$(".tab_item").addClass("fadeOutLeftBig").hide("fast").eq($(this).index()).switchClass("fadeOutLeftBig", "fadeInRightBig").fadeIn("fast")
}).eq(0).addClass("active");

Show/hide 个标签，从右到左

Show/hide tabs from right to the left

css

jquery

tabs

show

hide