<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>js实现div+css三级菜单</title>
</head>
<style type=”text/css”>
#nav{width:200px;font-size:12px;}
#nav ul{line-height:22px;}
</style>
<script type=”text/javascript”>
function Show_Menu(id_numa,numa){
document.getElementById(“content_”+id_numa+numa).style.display=”";
}
function hid_Menu(id_numa,numa){
document.getElementById(“content_”+id_numa+numa).style.display=”none”;
}
</script>
<body>
<div id=”nav” >
<li><a href=”" id=”menu_12″ onmouseover=”setTimeout(‘Show_Menu(1,2)’,200);” >div+css分级js菜单</a></li>
<ul id=”content_12″ style=”display:none;”>
<li><a href=”#” id=”menu_10″ onmouseover=”setTimeout(‘Show_Menu(1,0)’,200);” onmouseout=”setTimeout(‘hid_Menu(1,0)’,200);” >div+css子菜单1</a></li>
<li id=”content_10″ style=”display:none;”>
<a href=”" >html菜单树</a>
<a href=”" >html菜单树</a>
<a href=”" >html菜单树</a>
<a href=”" >html菜单树</a>
<a href=”" >html菜单树</a>
</li>
<li><a href=”#” id=”menu_11″ onmouseover=”setTimeout(‘Show_Menu(1,1)’,200);” onmouseout=”setTimeout(‘hid_Menu(1,1)’,200);” >div+css子菜单2</a></li>
<li id=”content_11″ style=”display:none;”>
<a href=”" >html菜单树</a>
<a href=”" >html菜单树</a>
<a href=”" >html菜单树</a>
<a href=”" >html菜单树</a>
<a href=”" >html菜单树</a>
</li>
</ul>
</div>
</body>
</html>
把上面代码存为html,用浏览器打开即可预览,兼容各类浏览器!
本站文章欢迎转载。转载请注明：转载自迷失曾经谢谢！
原文链接地址：js实现div+css三级菜单代码实现 Tags: div+css三级菜单, js三级菜单
