前几天要用到一个下拉菜单，就自己写了个。
虽不是好东西，也拿出来共享下，献丑了。
请多提意见。代码如下：
<!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" xml:lang="zh-CN" lang="zh-CN">
<head>
<script language="javascript">
function showMenu(n){
var lis=document.getElementById('menus').getElementsByTagName('li');
var num=lis.length;
for(i=1;i<num+1;i++){
document.getElementById('menu'+i).style.display='none';
}
document.getElementById('menu'+n).style.display='';
for (i=0;i<lis.length;i++){
lis[i].style.backgroundColor='';
}
lis[n-1].style.backgroundColor='#595757';
}</script>
<style type="text/css">
a.navs{width:50px; padding:0 5px 0 5px;}
a.navs:link,a.r:link{color:#FFFFFF;}
a.navs:visited,a.r:visited{color:#FFFFFF;}
a.navs:hover,a.r:hover{color:#FFFFFF; }
.Nav ul {
padding: 0px;
list-style-type: none;
margin:0;
background-color: #b93d47;
width: 300px;
height: 20px;
}
.Nav li {
margin: 0px 1px 0px 0px;
padding: 2px 9px 1px 9px;
float: left;
color: #FFFFFF;
font-size: 15px;
height: 17px;
}
.submenu a {
padding:2px 8px 0px 13px;
float: left; text-decoration:none;
}
.submenu a:hover,.submenu a:link,.submenu a:visited {
color:#000000;
}
.submenu #menu2 {
margin-left: 80px;
}
.submenu #menu3 {
margin-left: 155px;
}
</style>
</head>
<body>
<div class="Nav" id="menus"><ul>
<li><a href="#" class="navs" onmouseover="showMenu(1)">Company</a></li>
<li><a href="#" class="navs" onmouseover="showMenu(2)">Products</a></li>
<li><a href="#" class="navs" onmouseover="showMenu(3)">Press</a></li>
</ul>
</div>
<div class="submenu" id="submenus">
<div id="menu1">
<a href="#">Profile</a><a href="#">Mission</a></div>
<div id="menu2" style="display:none">
<a href="#">products1</a><a href="#">products2</a><a href="#">products3</a></div>
<div id="menu3" style="display:none">
<a href="#">News</a><a href="#">Events</a></div>
</div>
</body>
</html>
收藏了，正是我需要的！！！~~~~~~~~