首先非常感谢网友czqn8的无私分享，此Jquery特效是一款非常简单、非常实用的导航菜单，实现后台左侧菜单特效制作，也是他分享到JquerySchool网站的第一个作品，非常适合网友们对导航菜单制作的学习，代码结构清晰，一看便懂。。。
Jquery代码如下：
$(document).ready(function(){
$('.box h1:first').addClass('active');
$('.box p:not(:first)').hide();
$('.box h1').hover(function(){
$(this).addClass('hover');
},function(){
$(this).removeClass('hover');
});
$('.box h1').click(function(){
$(this).next('p').slideToggle().siblings('p').slideUp();
$(this).toggleClass('active').siblings('h1').removeClass('active');
});
});
HTML代码如下：
<div class="box">
<h1>菜单一</h1>
<p>内容</p>
<h1>菜单二</h1>
<p>内容</p>
<h1>菜单三</h1>
<p>内容</p>
<h1>菜单四</h1>
<p>内容</p>
<h1>菜单五</h1>
<p>内容</p>
</div>
效果如下：
如果您觉得本作品对您的学习有所帮助：
关键字：
导航菜单 选项卡 二级菜单 三级联动 下拉框 树形菜单 树控件 网友czqn8