jquery实现导航栏效果

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

</head>

<div class="box">

<ul class="menu">

<li class="level1">

<a href=#>衬衫</a>

<ul class="level2">

<li><a href="none">短袖衬衫</a></li>

<li><a href="none">长袖衬衫</a></li>

<li><a href="none">短袖T桖</a></li>

<li><a href="none">长袖T桖</a></li>

</ul>

</li>

<li class="level1">

<a href=#>卫衣</a>

<ul class="level2">

<li><a href="none">开襟卫衣</a></li>

<li><a href="none">套头卫衣</a></li>

<li><a href="none">运动卫衣</a></li>

<li><a href="none">童装卫衣</a></li>

</ul>

</li>

<li class="level1">

<a href=#>裤子</a>

<ul class="level2">

<li><a href="none">短裤</a></li>

<li><a href="none">休闲裤</a></li>

<li><a href="none">牛仔裤</a></li>

<li><a href="none">免烫卡其裤</a></li>

</ul>

</li>

</ul>

</div>

<script src="Z:/www/nubia_insurance/res/js/jquery.js?v=1"></script>

<script type="text/javascript">

$('.level1 > a').click(function(){

$(this).addClass("current").next().show().parent().siblings().children("a").removeClass("current").next().hide();

return false;

});

$(function(){

});

</script>

</html>