jquery 下拉菜单

<div class="wrap">
<ul>
<li>
<a href="javascript:void(0);">一级菜单1</a>
<ul class="ul">
<li><a href="javascript:void(0);">二级菜单11</a></li>
<li><a href="javascript:void(0);">二级菜单12</a></li>
<li><a href="javascript:void(0);">二级菜单13</a></li>
</ul>
</li>
<li>
<a href="javascript:void(0);">一级菜单2</a>
<ul>
<li><a href="javascript:void(0);">二级菜单21</a></li>
<li><a href="javascript:void(0);">二级菜单22</a></li>
<li><a href="javascript:void(0);">二级菜单23</a></li>
</ul>
</li>
<li>
<a href="javascript:void(0);">一级菜单3</a>
<ul>
<li><a href="javascript:void(0);">二级菜单31</a></li>
<li><a href="javascript:void(0);">二级菜单32</a></li>
<li><a href="javascript:void(0);">二级菜单33</a></li>
</ul>
</li>
</ul>
  </div>

<script>
$(function () {
var $li=$(".wrap>ul>li");
//给li注册鼠标经过事件,让自己的ul显示出来
$li.mouseover(function () {
$(this).children("ul").stop().slideDown();//jq 转换 DOM
});
$li.mouseout(function () {
$(this).children("ul").stop().slideUp();
});
});
</script>
posted @ 2018-12-10 21:52  lujieting0  阅读(148)  评论(0编辑  收藏  举报