jQuery选项卡动画不工作

由于某些原因，我无法使用jQuery UI选项卡制作任何动画。我已经尝试了许多例子，但都没有成功

下面是我如何安排我的标签

<div id="tabs">
    <ul class="tabsHeader">
        <h1>PARTNERSHIPS</h1>
        <li><a href="#tabs-1"><span class="toothIcon"></span>The Benefits</a></li>
        <li><a href="#tabs-2"><span class="avatarIcon"></span>Join Us</a></li>
    </ul>

    <div class="clearfix"></div>

    <div id="tabs-1">
        <div class="content">
            <h1>header</h1>
            <ul>
                <li>text</li>
                <li>text</li>
                <li>text</li>
                <li>text</li>
                <li>text</li>
                <li>text</li>
            </ul>
        </div>
    </div>

    <div id="tabs-2">
        <div class="content">
        <p>some text</p>
            <form>
                <input type="text" name="name" placeholder="NAME" />
                <input type="text" name="email" placeholder="EMAIL" />
                <input type="text" name="phone" placeholder="PHONE" />
                <input type="text" name="city" placeholder="CITY OF PRACTICE" />
                <input type="submit" />
            </form>
        </div>
    </div>
</div>

或

---

选项卡按设想的方式工作，但没有动画？有人知道为什么吗？

您正在使用旧的API文档。检查这个

您需要使用

hide

和

show

属性来定义动画，而不是

fxFade

等

使用jQuery选项卡的和进行动画

您可以通过使用

布尔值

、

数字

、

字符串

、或

对象

来实现这一点

---

布尔值：

当设置为true时，面板将以默认持续时间和默认缓和时间淡入

演示：

---

数字（毫秒）：

面板将以指定的持续时间和默认值淡入

演示：

---

字符串：

该值可以是内置jQuery动画方法的名称，如“slideDown”，也可以是jQuery UI效果的名称，如“fold”。在任何一种情况下，该效应都将与违约持续时间和违约宽松一起使用

演示：

---

对象：

如果值是对象，则可以提供效果、延迟、持续时间和缓和属性

演示：

---

您需要提供插件。然而，在你提供的链接中，插件下载似乎已经不存在了。我实际上并没有使用这个库，我从中获得了标签用户界面。fadeIn和fadeOut有效，但如果我使用$（“#tabs”）.tabs（{hide:{效果：“爆炸”，持续时间：1000}）；我什么也得不到。。。我想这是因为我没有包括“秀”@Romes sure thing，我添加了一个更详细的动画说明。希望这有帮助！

$('#tabs').tabs({ fxFade: true, fxSpeed: 'fast' });

$( "#tabs" ).tabs({ hide: { effect: "explode", duration: 1000 } });

 $('#tabs').tabs({ 
     hide: true,
     show: false   
 });

 $('#tabs').tabs({ 
     hide: 1000,
     show: 2000
 });

 $('#tabs').tabs({ 
     hide: 'fade',
     show: 'explode'   
 });

 $('#tabs').tabs({ 
     hide: { effect: "fade", duration: 200 },
     show: { effect: "fade", duration: 200 }    
 });