Javascript/Jquery幻灯片效果发生在错误的地方

我的页面中有一个部分合并了Jquery滑动效果，但是应该滑动到原始位置的div滑动得太低，然后刚好弹出到位。我不太确定它为什么会这样。我该怎么做才能使新的div和原来的div在同一平面上滑动?下面是我的JS以及一个小提琴的链接，这样你就可以明白我的意思了。谢谢!

$(document).ready(function() {
$("#content div").hide();
$("#tabs li:first").attr("id","current");
$("#content div:first").effect("slide", 800);
var animating = false;
$('#tabs a').click(function(e) {
    e.preventDefault();
    if ($(this).closest("li").attr("id") == "current"){
    return;       
    }
    else{
        if(!animating)             
            $("#content div").hide("slide", {direction: "right"}, 800, function() { animating = true; });
            $("#tabs li").attr("id","");
            $(this).parent().attr("id","current");
            $('#' + $(this).attr('name')).show("slide", {direction: "left"}, 800, function() { animating = false;});
    }
});
});