JQuery слайд-меню

Question

У меня есть ссылка, которая когда-то зависала над полем внизу, скользит вниз, а после удаления указателя она снова скользит вверх. У меня это работает почти так, как я хочу, хотя в IE8 (еще не проверял в других IE) текст в поле, которое скользит вниз, не центрируется. В Firefox, когда он скользит вниз, углы не гладкие, но они в IE.

Код:

<script type="text/javascript">

 $(document).ready(function() 
 {
    $('#nav_top').corners('5px');
        $('#nav_bottom').hide();
        $('#nav_bottom').corners();

    $('#link').hover(function() 
        {
            $('#nav_top').corners('10px top');
            $('#nav_bottom').stop(true, true).slideDown();                  
            $('#nav_bottom').slideDown("slow");



        },

        function ()
        {
        $('#nav_bottom').slideUp("fast");

    }

        );          


}); 

</script>   


<div id="nav_top">

<a href="javascript:void(0);" id="link">Hover</a>

<div id="nav_bottom">

<br />Stuff 

</div>

</div>

</div>

Любой совет, также лучше использовать .hover или .mouseEnter / mouseLeave?

Спасибо

Css:

nav_top
{
background-color: #084B8A;
text-align: center;
margin-left: 150px; 
margin-top: 15px;
width: 100px;
padding: 20px;  
font-size: 20px;
}

#nav_top a
{
text-decoration: none;
color: #ffffff;
}


#nav_bottom
{
text-align: center;
background-color: #084B8A;  
z-index: 1;
padding: 30px;  

}

Answer 1

попробуйте это!

$("#link").hover(
    function() { 
   $('#nav_top').corners('10px top');
    $(this).next().slideDown("slow");
    },
    function() {  
    $(this).next().slideUp("fast");
  }
);

CSS

in anycase you need to set the position:
//container
#nav_top {
  position: relative;
}
//the inner element
#nav_bottom {
  position: absolute;
 
}

Answer 2

Могу поспорить, что центрированный текст - это не проблема jquery, а проблема css. Вы пытались использовать style = "text-align: center;" вот так