اشکال این منو

[olampiad]

سلام
به این تصویر یه نگا بندازید
http://s2.picofile.com/file/7965323331/hamid.png
من یه منو درست کردم
موقعی که ماس روی اون می ره به جای اینکه ul زیر اون باز بشه.
اطرافش باز می شه.
مشکلش از کجاس
اینم کد هاش


<nav>
<ul>
<li><a href="#" title='main nav link'>Exhibition</a>
<ul>
<li><a href="#" title='main nav link'>Link 1-1</a></li>
<li><a href="#" title='main nav link'>Link 1-2</a></li>
<li><a href="#" title='main nav link'>Link 1-3</a></li>
</ul>
</li>
<li><a href="#" title='main nav link'>Transport</a>
<ul>
<li><a href="#" title='main nav link'>Link 2-1</a></li>
<li><a href="#" title='main nav link'>Link 2-2</a></li>
<li><a href="#" title='main nav link'>Link 2-3</a></li>
</ul>
</li>
<li><a href="#" title='main nav link active'>Leipzig</a>
<ul>
<li><a href="#" title='main nav link'>Link 3-1</a></li>
<li><a href="#" title='main nav link'>Link 3-2</a></li>
<li><a href="#" title='main nav link'>Link 3-3</a></li>
</ul>
</li>
<li><a href="#" title='main nav link'>Organizers</a></li>
</ul>
</nav>




header nav{
width:1000px;
height:35px;
background:#000;
margin:auto;
border-radius:3px;
padding-top:1px;
}
header nav ul{
margin:0px;
padding:0px;
list-style:none;
width:800px;
float:left;
height:35px;
}
header nav li a:link,header nav li a:visited{
float:left;
color:#FFF;
padding-left:7px;
padding-right:7px;
padding-top:7px;
height:30px;
text-decoration:none;
font-size:14px;
}
header nav li{
position:relative;
}
header nav ul li a:hover{
background:#C30;
border-radius:3px;
}
header nav li ul{
top:40px;
list-style:none;
display:none;
margin:0px;
padding:0px;
background:#000;
width:auto;
height:200px;
position:relative;
right:0px;
}





$('header nav ul li').hover(function(){
$(this).find('ul:first').slideDown(500)
})

$('header nav ul li').mouseleave(function(){
$(this).find('ul:first').slideUp(500)
})



ممنون