jQuery用户界面选项卡-显示选项重置窗口位置

Question

当我在jQuery UI中使用简单模板时，如下所示：

<div id="products-tabs">
    <ul>
        <li><a href="#product-1">Product 1</a></li>
        <li><a href="#product-2">Product 2</a></li>
    </ul>

    <div id="product-1">
        Product 1
    </div>
    <div id="product-2">
        Product 2
    </div>
</div>

联署材料：

$('#products-tabs').tabs();

那一切都很好。但我想增加不同标签之间摇摆的效果。例如：

$('#products-tabs').tabs({
    show: { effect: "fadeIn", duration: 800 }
});

它可以工作，但是当我在页面底部有选项卡时，当我单击其中一个选项卡时，窗口的位置会重置为顶部。我怎样才能阻止它？

这里的小提琴：http://jsfiddle.net/46a8y/3/ (只需滚动到输出窗口的底部，以了解我的意思)

Answer 1

更新jquery版本，jQuery2.1.0或1.9.1可以正常工作。

Answer 2

激活选项卡后，您可以调用回调以跳转到页面底部吗？

activate: function(){
    $("html, body").animate({ scrollTop: $(document).height() }, 1000);
}

像这样：http://jsfiddle.net/46a8y/4/

Answer 3

将选项卡div封装在另一个固定高度的div中：

<div id="wrapper">your tabs</div>

小提琴