为什么我做的下拉菜单被被下边框架挡住了，怎么处理呢？

urlcn · 发表于 2009-12-27 13:29:08

本帖最后由 urlcn 于 2009-12-27 14:21 编辑

为什么我做的下拉菜单被被下边框架挡住了，怎么处理呢？请高手们帮帮忙吧！！

以下是代码：

js代码：

function menuFix() {
var sfEls = document.getElementById("nav").getElementsByTagName("li");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=(this.className.length>0? " ": "") + "sfhover";
}
sfEls[i].onMouseDown=function() {
this.className+=(this.className.length>0? " ": "") + "sfhover";
}
sfEls[i].onMouseUp=function() {
this.className+=(this.className.length>0? " ": "") + "sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp("( ?|^)sfhover\\b"),
"");
}
}
}
window.onload=menuFix;

复制代码

common.css

/* header style */
#header { width:960px; height:80px; background:url(../images/headerbg.jpg) no-repeat; overflow:hidden; margin:0px auto; }
#header h2 { float:left; }
#header h2 img { width:250px; height:80px; }
#header .ad_header { float:right; text-align:right; }
/*下拉菜单样式*/
*{margin:0;padding:0;border:0;}
#div_center { width:960px; height:23px; background:#003399; margin-left: auto;margin-right:auto;} /*定义总体宽度、高度；background:003399; 控制背景颜色,居中对齐*/
#nav { line-height: 20px; list-style-type: none; margin-top:5px;} /*控制一级菜单行高；上边距5px；*/
#nav a { display: block; width: 77px; text-align:center; font-size:12px;} /*一级菜单链接总体样式：每个菜单的宽，居中对齐，文字大小*/
#nav a:link { color:#FFF; text-decoration:none;margin:0;} /* 未访问的链接 */
#nav a:visited {color:#FFF;text-decoration:none;margin:0;} /* 已访问的颜色 */
#nav a:hover {color:#C00;text-decoration:none;} /* 鼠标在链接上 */
#nav li {float: left;} /* 一级菜左对齐 */
#nav li a:hover{background:#FFFFFF;} /* 鼠标在一级菜单上改变其背景色 */
#nav li ul {line-height: 24px; background:#FFF; list-style-type: none;text-align:left;left: -999em; width:132px; position: absolute;border-width: 1px;border-top-style: none;border-right-style: solid;border-bottom-style: solid;border-left-style: solid;border-color: #003399; padding:1px;} /*二级菜单总体样式：行高24px；背景颜色；外框宽度；相对位置；边框一个象素，上边没样式，左右下边实线，边框颜色#003399；内边距1个象素*/
#nav li ul a{display:block; width: 130px;text-align:left;padding-left:2px;} /* 二级菜单链接样式；背景宽度、左对齐，左缩进2 */
#nav li ul a:link {color:#0d5097; text-decoration:none;} /* 未访问的链接 */
#nav li ul a:visited {color:#0d5097;text-decoration:none;} /* 已访问的链接 */
#nav li ul a:hover {color:#FFF;text-decoration:none;font-weight:normal;background:#003399;}/* 鼠标在链接上 */
#nav li:hover ul {left: auto;}
#nav li.sfhover ul {left: auto;}
#content {clear: left;}

复制代码

header.html.php

<body>
<div id="append_parent"></div>
<div id="ajaxwaitid"></div>
<div id="header">
<h2><a href="{S_URL}"><img src="{S_URL}/templates/default/images/logo.gif" alt="$_SCONFIG[sitename]" /></a></h2>
<div class="ad_header">$ads[pageheadad]</div>
</div>
<div id=div_center>
<UL id=nav>
<LI style="MARGIN-LEFT: 10px"><A href="http://#">网站首页</A></LI>
<LI><A href="http://#">新闻中心</A>
<UL>
<LI><A href="http://#">·新闻中心1</A></LI>
<LI><A href="http://#">·新闻中心2</A></LI>
<LI><A href="http://#">·新闻中心3</A></LI></UL></LI>
<LI><A href="http://#">企业简介</A>
<UL>
<LI><A href="http://#">·企业简介1</A></LI>
<LI><A href="http://#">·企业简介2</A></LI>
<LI><A href="http://#">·企业简介3</A></LI>
<LI><A href="http://#">·企业风采4</A></LI>
<LI><A href="http://#">·企业简介5</A></LI>
<LI><A href="http://#">·企业简介6</A></LI></UL></LI>
<LI><A href="http://#">文章中心</A>
<UL>
<LI><A href="http://#">·文章中心</A></LI>
<LI><A href="http://#">·文章中心</A></LI>
<LI><A href="http://#">·文章中心</A></LI>
<LI><A href="http://#">·文章中心</A></LI>
<LI><A href="http://#">·文章中心</A></LI></UL></LI>
<LI><A href="http://#">国际新闻</A>
<UL>
<LI><A href="http://#">·国际新闻</A></LI>
<LI><A href="http://#">·国际新闻</A></LI>
<LI><A href="http://#">·国际新闻</A></LI>
<LI><A href="http://#">·国际新闻</A></LI>
<LI><A href="http://#">·国际新闻</A></LI>
<LI><A href="http://#">·国际新闻</A></LI>
<LI><A href="http://#">·国际新闻</A></LI>
<LI><A href="http://#">·国际新闻</A></LI></UL></LI>
<LI><A href="http://#">图片中心</A>
<UL>
<LI><A href="http://#">·图片中心</A></LI>
<LI><A href="http://#">·图片中心</A></LI>
<LI><A href="http://#">·图片中心</A></LI></UL></LI>
<LI><A href="http://#">下载中心</A>
<UL>
<LI><A href="http://#">·常用软件</A></LI>
<LI><A href="http://#">·文档下载</A></LI>
<LI><A href="http://#">·资料下载</A></LI></UL></LI>
<LI><A href="http://#">留言中心</A></LI>
<LI><A href="http://#">社区论坛</A></LI></UL>
</div>

复制代码

		自动登录	找回密码
密码			立即注册

[疑问] 为什么我做的下拉菜单被被下边框架挡住了，怎么处理呢？