高分 jQuery 应用问题

今日用jQuery做一个选项卡效果，想在选项卡页面切换时使用slide效果，结果造成选项卡切换不正常，现贴上代码，请求js高手解决。

HTML部分代码如下哦

<div class="tab">   

<div class="tab_menu">   

 <ul>   

 <li class="selected"><span>xhtml</span></li>   

<li><span>css</span></li>   

<li><span>javascript</span></li>   

</ul>   

</div>   

<div class="tab_box">   

<div>xhtml</div>   

 <div>css</div>   

<div>javascript</div>   

 </div>   

</div>   

js部分代码如下

<script type="text/javascript">  
$(function(){  
   var tab_menu_li = $('.tab_menu li');  
   $('.tab_box div:gt(0)').hide();  
      
    tab_menu_li.mouseover(function(){  
        $(this).addClass('selected')  
               .siblings().removeClass('selected');  
 
        var index = tab_menu_li.index(this);//用于同步  
        $('.tab_box div').eq(index).show("slide",{direction:"left"})  
                         .siblings().hide("slide",{direction:"right"});  
    }).hover(function(){  
        $(this).addClass('hover');  
    },function(){  
        $(this).removeClass('hover');  
    });  
});  
</script>

注意一下这两行

        $('.tab_box div').eq(index).show("slide",{direction:"left"})  
                         .siblings().hide("slide",{direction:"right"});  

本来使用的切换效果只是简单的.show() 和.hide(),选项卡切换正常

但我换成slide效果就不正常了，有劳高人在不改动HTML代码的前提下修改js代码做到可以正常使用slide效果的代码，切实可用后，给予加分！

.show()或.hide()是没有动画效果的，你应该使用.slideDown("slow")或.slideUp("slow")