收缩菜单

<style type="text/css">
a{text-decoration:none;}
li{list-style-type:none;}
</style>

<script type="text/javascript" src="../jquery-1.7.2.js"></script>

<script type="text/javascript">
$(function(){
	$('.level1 > a').click(function(){
		$(this).addClass('current')
			.next().show()
			.parent().siblings().children('a').removeClass('current')
			.next().hide();
	});

});
</script>

<div>
	<ul class="menu">
		<li class="level1">
			<a href="#">手机</a>
			<ul class="level2">
				<li><a href="#">智能手机</a></li>
				<li><a href="#">音乐手机</a></li>
				<li><a href="#">拍照手机</a></li>
			</uL>
		</li>
		<li class="level1">
			<a href="#">电脑</a>
			<ul class="level2">
				<li><a href="#">平板</a></li>
				<li><a href="#">笔记本</a></li>
				<li><a href="#">超级本</a></li>
			</uL>
		</li>
		<li class="level1">
			<a href="#">编程语言</a>
			<ul class="level2">
				<li><a href="#">php</a></li>
				<li><a href="#">java</a></li>
				<li><a href="#">.net</a></li>
			</uL>
		</li>		
	</ul>

</div>