一级二级菜单slideToggle

来源：互联网发布：投诉对淘宝卖家的影响编辑：程序博客网时间：2024/04/30 06:43
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head><script type="text/javascript" src="jquery.min.js"></script><script type="text/javascript" src="jquery-1.8.0.min.js"></script><style type="text/css">*{margin:0;padding:0}.content{margin:100px auto;width:800px;height:1000px;border:1px red solid;}ul{list-style-type:none;width:300px;height:30px;border:1px red solid;margin:0 auto;}.content li{float:left;width:40px;height:30px;background:yellow ;text-align:center;line-height:30px;padding-left:20px;}.content ul li ul{display:none;}</style> <script type="text/javascript">$(function(){$('.content ul>li').hover(function(){$(this).children().slideToggle();});}); </script></head><body><div class="content"><ul><li>菜单1<ul><li>菜单</li><li>菜单</li><li>菜单</li><li>菜单</li><li>菜单</li></ul></li><li>菜单2<ul><li>菜单</li><li>菜单</li><li>菜单</li><li>菜单</li><li>菜单</li></ul></li><li>菜单3<ul><li>菜单</li><li>菜单</li><li>菜单</li><li>菜单</li><li>菜单</li></ul></li><li>菜单4<ul><li>菜单</li><li>菜单</li><li>菜单</li><li>菜单</li><li>菜单</li></ul></li><li>菜单5<ul><li>菜单</li><li>菜单</li><li>菜单</li><li>菜单</li><li>菜单</li></ul></li></ul></div></body></html>
0 0