做web前端开发经常会遇到那种划到导航栏，会出现下拉菜单的的情况。
网上给出的那些原生态js效果太复杂
今天结合JQuery 做了一个，真是简单之极，几行代码就搞定了的基本功能。
HTML 部分
<a href="#" id="shangxia">JavaScript</a>
<div class="shangxia">
显示的内容
</div>
JS 部分
<script type="text/javascript">
$(document).ready(function() {
$('#shangxia').hover(function() {
$('.shangxia').slideDown();
$('.shangxia').css("visibility", "visible");
});
$(".shangxia").mouseleave(function() {
$('.shangxia').slideUp();
});
})
</script>
CSS 部分
.shangxia
{
position: absolute;
visibility: hidden;
width:500px;
height:200px;
border: 1px solid red;
}
有这么一个简单的基本框架，去扩充，思路就清晰多了！