折叠菜单，我已经把第一个设置成了display:none了，可是默认打开时候还是合不上。
<!DOCTYPE html>
<html>
<head>
<title>左侧菜单</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSS代码 -->
<style>
.menu_list {
width: 268px;
margin: 0;
}
.menu_head {
height: 47px;
line-height: 47px;
padding-left: 38px;
font-size: 14px;
color: #525252;
cursor: pointer;
border: 1px solid #f1f1f1;
position: relative;
margin: 0px;
font-weight: bold;
background: #51a9f18c;
}
.menu_list .current {
background: #51a9f18c;
}
.menu_nva {
line-height: 38px;
border-left: 1px solid #51a9f18c;
backguound: #fff;
border-right: 1px solid #51a9f18c;
}
.menu_nva a {
display: block;
height: 38px;
line-height: 38px;
padding-left: 38px;
color: #777777;
background: #fff;
text-decoration: none;
border-bottom: 1px solid #51a9f18c;
}
.menu_nva a:hover {
text-decoration: none;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"></head>
<body>
<!-- html start-->
<div id="firstpaneDiv" class="menu_list">
<h3 class="menu_head current">系统管理</h3>
<div style="display:none" class="menu_nva">
<a href="#">菜单管理</a>
<a href="#">账户管理</a>
<a href="#">日志管理</a>
</div>
<h3 class="menu_head">xxx菜单1</h3>
<div style="display:none" class="menu_nva">
<a href="#">用例1xx</a>
<a href="#">用例2xx</a>
<a href="#">用例3xx</a>
<a href="#">用例4xx</a>
</div>
<h3 class="menu_head">xxx菜单2</h3>
<div style="display:block" class="menu_nva">
<a href="#">用例1xx</a>
<a href="#">用例2xx</a>
<a href="#">用例3xx</a>
<a href="#">用例4xx</a>
</div><h3 class="menu_head">xxx菜单3</h3>
<div style="display:none" class="menu_nva">
<a href="#">用例1xx</a>
<a href="#">用例2xx</a>
<a href="#">用例3xx</a>
<a href="#">用例4xx</a>
<a href="#">用例8xx</a>
</div><h3 class="menu_head">xxx菜单4</h3>
<div style="display:none" class="menu_nva">
<a href="#">用例1xx</a>
<a href="#">用例2xx</a>
<a href="#">用例7xx</a>
<a href="#">用例8xx</a>
</div>
<h3 class="menu_head">xxx菜单5</h3>
<div style="display:none" class="menu_nva">
<a href="#">用例1xx</a>
<a href="#">用例2xx</a>
<a href="#">用例3xx</a>
</div>
<!-- html end-->
<!-- script 代码-->
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#firstpaneDiv .menu_nva:eq(0)").show();
$("#firstpaneDiv h3.menu_head").click(function(){
$(this).addClass("current").next("div.menu_nva").slideToggle(200).siblings("div.menu_nva").slideUp("slow");
$(this).siblings().removeClass("current");
});
$("#secondpane .menu_nva:eq(0)").show();
$("#secondpane h3.menu_head").mouseover(function(){
$(this).addClass("current").next("div.menu_nva").slideDown(400).siblings("div.menu_nva").slideUp("slow");
$(this).siblings().removeClass("current");
});
});
</script>
</body>
</html>
