jQuery ui选项卡：切换标签之间的滑动效果

Question

我正在使用jquery ui选项卡。我想在标签之间切换时应用滑动内容效果，即显示和隐藏标签内容。这是我的DEMO

我试图滑动选项卡divs与他们的内容，当我点击上面的导航全部。所以导航链接1＃将标签-1在屏幕的正前方，等

脚本我有目前，它没有滑动功能的滑动内容是：

$(document).ready(function() { 
    $('#tabs').tabs(); 

    $('.sub-nav a').click(function() { 
    $('.sub-nav li a').removeClass('subnav-active'); 
    $(this).addClass('subnav-active'); 
    }); 

}); 

我试着做slideToggle，以及只是一个fading out和fading in效果，但不能得到任何工作。所以，我伸出援助之手，即使它只是一个地方，但我会非常感激，因为我不是JavaScript或jQuery中最伟大的。

Answer 1

jQueryUI内置了特效。无需自行滚动。

http://api.jqueryui.com/slide-effect/

http://jsfiddle.net/isherwood/9jg4r/4/

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

下面是与展会为例，隐藏效果：http://jsfiddle.net/isherwood/9jg4r/5