菜单伸缩实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>菜单伸缩实例</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
var $dt=$("dl#two dt.two2");
$dt.nextAll("dd,span").slideUp();
$dt.click(function(){
$dt.prevAll("dd,span").slideUp();
$dt.nextAll("dd,span").slideDown();
});
$("dl#two dt.two1").click(function(){
var $self=$(this);
$dt.prevAll("dd,span").slideDown();
$dt.nextAll("dd,span").slideUp();
});
});
</script>
<style>
*{padding:0;margin:0;color:#000;}
a{text-decoration:none;}
dl{background:#eee;100px;}
dt{font-weight:bold;cursor:pointer;}
dt,dd{100px;height:30px;line-height:30px;border-bottom:1px solid #ccc;}
</style>
</head>
<body>
<dl >我的共享指标</a></dd>
<dt class="two2">市政管理</dt>
<dd><a href="javascript:void(0)">单项工程指标</a></dd>
<dd><a href="javascript:void(0)">综合指标</a></dd>
<dd><a href="javascript:void(0)">单元指标</a></dd>
<span>
<dd><a href="javascript:void(0)">分部分项指标</a></dd>
<dd><a href="javascript:void(0)">工程量指标</a></dd>
</span>
<dd><a href="javascript:void(0)">指标审核</a></dd>
<dd><a href="javascript:void(0)">我的共享指标</a></dd>
</dl>
</body>
</html>