首页 > 代码库 > jquery设置下拉菜单
jquery设置下拉菜单
jQuery代码
1,引用jQuery库
2,show方法
3,hide方法
<script type="text/javascript">
$function(){
$(".navmeau").mouseover(function(){
$(this).children("ul").show();
})
$(".navmeau").mouseout(function(){
$(this).children("ul").hide();
})
}
</script>
html代码
<div id="nav">
<ul>
<li><a href="http://www.mamicode.com/#">首页</a></li>
" class="navmeau" ><a href="http://www.mamicode.com/#">课程大厅</a>
<ul>
<li><a href="http://www.mamicode.com/#">JavaScript</a></li>
<li><a href="http://www.mamicode.com/#">Html/CSS</a></li>
</ul>
</li>
<li class="navmeau"><a href="http://www.mamicode.com/#">学习中心</a>
<ul>
<li><a href="http://www.mamicode.com/#">视频学习</a></li>
<li><a href="http://www.mamicode.com/#">实例练习</a></li>
<li><a href="http://www.mamicode.com/#">问与答</a></li>
</ul>
</li>
<li><a href="http://www.mamicode.com/#">经典案例</a></li>
<li><a href="http://www.mamicode.com/#">关于我们</a></li>
</ul>
jquery设置下拉菜单