求高手修改一下简单的javascript下拉菜单

完整代码如下<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/x... 完整代码如下

<!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>导航条</title>
<style type="text/css">
*{margin: 0; padding: 0;}
body{
background: black;
}
#all {
width: 960px;
height: 900px;
margin: 0 auto;
background: white;
position: relative;
}
#nav {
list-style: none;
font-size: 16px;
display: inline;
position: absolute;
top: 30px;
right: 20px;
z-index: 10;
}
#nav li a {
font-family: "微软雅黑" , "黑体" , "宋体";
text-decoration: none;
padding: 20px 30px;
display: block;
background: #2287f9;
color: white;
font-weight: bold;
}
#nav li a:hover {
background: #1f7ce5;
}
#nav .menu {
float: left;
position:relative;
z-index: 100;
}
#nav li span {
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: 100;
display: block;
}
#navbg {
width: 600px;
height: 80px;
background: #ebeaea;
position: absolute;
top: 45px;
right: 8px;
z-index: 0;
}

#nav .submenu_zzjs {
width: auto;
position:absolute;
left:0;
top: 76px;
display: none;
}

#nav .submenu_zzjs a {
display:block;
}

</style>
</head>
<body>
<div id="all">

<ul id="nav">
<li class="menu"><a href="#">百度知道<span>Home</span></a></li>
<dl class="submenu_zzjs">
<dd><a href="#">百度知道</a></dd>
<dd><a href="#">侨光集团</a></dd>
<dd><a href="#">百度知道</a></dd>
<dd><a href="#">百度知道</a></dd>
</dl>

<li class="menu"><a href="#">百度知道<span>Gztvu</span></a></li>
<li class="menu"><a href="#">百度知道<span>Gzqgedu</span></a></li>
<li class="menu"><a href="#">百度知道<span>Enro</span></a></li>
<li class="menu"><a href="#">合作办学<span>Collaborate</span></a></li>
</ul>
<div id="navbg"></div>
</div>

<script type="text/javascript">

</script>
</body>
</html>

这代码只能在IE6下实现下拉菜单功能
但在火狐和OP和IE9下就实现不了下拉菜单的功能了
弄了一个下午就找不到哪有问题- -只能求高手帮忙

CSS和html是我写的，javascript的部分是上网找源代码自己修改的
不知道是不是跟我写的css冲突了

希望能得到高手的帮忙~ 展开

 我来答

2个回答

#热议# 生活中有哪些实用的心理学知识？

前端老农
2011-11-16 · 搬砖十几年，头发都还在

前端老农

采纳数：424 获赞数：1268

向TA提问私信TA

关注

展开全部

fnNav(obj,flag)这个函数里obj.getElementsByTagName("dl")[0]取的是li的子节点，而你的结构里dl是写在li外头的

把结构改一下：
<li class="menu"><a href="#">百度知道<span>Home</span></a></li>
<dl class="submenu_zzjs">
<dd><a href="#">百度知道</a></dd>
<dd><a href="#">侨光集团</a></dd>
<dd><a href="#">百度知道</a></dd>
<dd><a href="#">百度知道</a></dd>
</dl>
改成：
<li class="menu"><a href="#">百度知道<span>Home</span></a>
<dl class="submenu_zzjs">
<dd><a href="#">百度知道</a></dd>
<dd><a href="#">侨光集团</a></dd>
<dd><a href="#">百度知道</a></dd>
<dd><a href="#">百度知道</a></dd>
</dl>
</li>
就可以了

已赞过 已踩过<

评论收起

可可的文档
2011-11-16 · TA获得超过234个赞

知道答主

回答量：78

采纳率：0%

帮助的人：73.2万

我也去答题访问个人页

关注

展开全部

你是比较粗心了，其实js代码都没有问题，css也没有问题。问题出在你的html代码上。
dl #submenu_zzjs应该放在 ul的第一个li里，如下：
<li class="menu">
	<a href="#">百度知道<span>Home</span></a>
		<dl class="submenu_zzjs">
			<dd><a href="#">百度知道</a></dd>
			<dd><a href="#">侨光集团</a></dd>
			<dd><a href="#">百度知道</a></dd>
			<dd><a href="#">百度知道</a></dd>
        </dl></li>

虽然这样可以，但是不符合语义的，你最好把dl改为ul。


本回答被提问者采纳






已赞过已踩过<

你对这个回答的评价是？
评论收起

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

求高手修改一下简单的javascript下拉菜单

其他类似问题

为你推荐：