经典的菜单问题！help me! 高分报答

phplover 2004-05-09 11:34:41
<!---------------------------------------------源代码--------------------------------------------------------------->
<style>
<!--
td{font-size:12px}
//-->
</style>
<TABLE width=778 border=0>
<TR>
<TD>
<TABLE border=1 cellspacing=0 bgColor=#ffffff width=100% bordercolordark=#ffffff>
<TR height=20>
<TD width=25% onmouseover="openMenu(0,150)" onmouseout="closeMenu()" bgColor=#FFCCCC> menu1</TD>
<TD width=25% onmouseover="openMenu(1,150)" onmouseout="closeMenu()" bgColor=#99CC66> menu2</TD>
<TD width=25% onmouseover="openMenu(2,150)" onmouseout="closeMenu()" bgColor=#66CC33> menu3</TD>
<TD width=25% onmouseover="openMenu(1,150)" onmouseout="closeMenu()" bgColor=#CC6600> menu4</TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
<select name=tadfs style="width:100%">
<option>a
<option>b
<option>c
</select>

<SCRIPT LANGUAGE="JavaScript">
<!--
//参数
var menuBgColor = "#CCCC66"; //菜单背景颜色
var menuBorderColor = "#000000"; //菜单边框的颜色
var menuLineH = 22; //菜单中每个栏目的高度
var menuItemBorderColor = "#000000";//菜单每个子栏目的边框颜色
var menuItemBgColor = "#CC9900";//菜单每个子栏目的背景颜色

//菜单栏目内容
var menuItem = new Array();
menuItem[0] = new Array();
menuItem[0][0] = ["笨猪one","test/one.html"];
menuItem[0][1] = ["笨猪two","testt.htm"];
menuItem[0][2] = ["笨猪3","testt.htm"];
menuItem[0][3] = ["笨猪4","testt.htm"];
menuItem[0][4] = ["笨猪5","testt.htm"];
menuItem[0][5] = ["笨猪笨猪笨猪笨猪","testt.htm"];
menuItem[0][6] = ["笨猪笨猪笨猪笨猪","testt.htm"];

menuItem[1] = new Array();
menuItem[1][0] = ["笨猪one","test/one.html"];
menuItem[1][1] = ["笨猪two","testt.htm"];
menuItem[1][2] = ["笨猪3","testt.htm"];
menuItem[1][3] = ["笨猪4","testt.htm"];

menuItem[2] = new Array();
menuItem[2][0] = ["笨猪one","test/one.html"];
menuItem[2][1] = ["笨猪two","testt.htm"];


var divId = "xxxxxxxMenu";
var frmName = "xxxxxxxMenuFrm";
document.write("<div id="+divId+" style='position: absolute;border:0;display:none; z-index: 999;' onmouseout=\"this.style.display='none'\" >");
// onmouseover=\"this.style.display=''\"
document.write("<iframe name="+frmName+" scrolling=no frameborder=0 width=100% height=100%></iframe></div>");
var menuDiv = document.getElementById(divId);
var menuFrm = document.frames(frmName);

function openMenu(key,w)
{
menuDiv.style.width = w;
var h = menuItem[key].length*menuLineH+4;
menuDiv.style.height = h;
menuFrm.resizeTo(w,h); //ie6下必须,ie5不必
var menuTbl = "<html><head><meta http-equiv='Content-Type' content='text/html; charset=gb2312'></head>"
+"<body scroll=no bgColor="+menuBgColor+" style='margin:0' topmargin=0 bottommargin=0 style='border:solid 1px "+menuBorderColor+"'>"
+"<table border=0 cellspacing=0 cellpadding=0 width=97% align=center>";
for(var n=0;n<menuItem[key].length;n++){
menuTbl += "<tr height="+menuLineH+">"
+"<td style='font-size:13px;cursor:hand' onmouseover=\"this.bgColor='"+menuItemBgColor+"';this.style.border='solid 1px "+menuItemBorderColor+"'\" onmouseout=\"this.bgColor='';this.style.border='solid 0'\" onclick=\"parent.location='"+menuItem[key][n][1]+"'\">"
+menuItem[key][n][0]
+"</td>"
+"</tr>";
}
menuTbl += "<table></body></html>";
with(menuFrm){
document.writeln(menuTbl);
document.close();
}
var src = window.event.srcElement;
var oTop = src.offsetTop, cHeight = src.clientHeight, oLeft = src.offsetLeft;
while(src = src.offsetParent){
oTop += src.offsetTop; oLeft += src.offsetLeft;
}
menuDiv.style.top = oTop + cHeight;
menuDiv.style.left = oLeft;
menuDiv.style.display = "";
}
function closeMenu()
{
// menuDiv.style.display = "none";
}
//-->
</SCRIPT>

<!-------------------------------------------------------------------------------------------
存在问题如下：
1. ie5下面，当鼠标离开菜单的时候，菜单不能消失。ie6下面正常。问题可能在iframe屏蔽了前面的div
2. 找到menuFrm.resizeTo(w,h),为什么ie6下面不执行这行，div的显示高度就不能低于100左右
3. 本想做到当鼠标离开某个td时,下面的菜单就消失,但这样会导致在ie5下面从td移动到下方菜单上时,菜单就会消失,如何解决？
-------------------------------------------------------------------------------------------->
...全文
80 15 打赏 收藏 转发到动态 举报
写回复
用AI写文章
15 条回复
切换为时间正序
请发表友善的回复…
发表回复
hotdog2002 2004-05-10
  • 打赏
  • 举报
 回复
mark
phplover 2004-05-10
  • 打赏
  • 举报
 回复
To Lostinet:
问题是在ie5里面document.onmousexxx会被div里面的iframe页面给屏蔽掉啊

to joe820302(joe):
我们是一个意思啊，我的ie6显示很正常
phplover 2004-05-10
  • 打赏
  • 举报
 回复
只有揭帖了。看样子只能用document.onclick来让菜单消失了
PcLoveC 2004-05-09
  • 打赏
  • 举报
 回复
搞定了，呵呵，现在也关心楼主的问题，帮你顶，也帮自己顶
PcLoveC 2004-05-09
  • 打赏
  • 举报
 回复
再问一下楼主，怎么样改变下拉菜单中字体中的颜色，你只能改背景色等，我想改变下拉菜单中的字体大小等色彩，如何改呢
phplover 2004-05-09
  • 打赏
  • 举报
 回复
<TD width=25% onmouseover="openMenu(1,150)" onmouseout="closeMenu()" ><span class="text style11" style="width:100%;height:100%">色带产品</span></TD>
PcLoveC 2004-05-09
  • 打赏
  • 举报
 回复
<TD width=120 onmouseover="openMenu(1,150)" onmouseout="closeMenu()" class="style11">标签产品</TD>
这样就可以了，呵呵，帮你顶，顶，顶
PcLoveC 2004-05-09
  • 打赏
  • 举报
 回复
在问一下，我用你的菜单为什么用了<td><img alt="" src="images/n_start.gif" width="1" height="45" border="0"></td>
<TD width=25% onmouseover="openMenu(1,150)" onmouseout="closeMenu()" ><span class="text style11">色带产品</span></TD>

用了span菜单有时不是固定在<td>的下方，有时会上去，如果不用<span>则正常

帮你顶，也请教你，呵呵，
PcLoveC 2004-05-09
  • 打赏
  • 举报
 回复
d
joe820302 2004-05-09
  • 打赏
  • 举报
 回复
鼠标从一级菜单移动到BODY上的时候，菜单不会消失~~~~~~
我是这个意思，不知道和楼主是否理解的一样
Lostinet 2004-05-09
  • 打赏
  • 举报
 回复
这种用document.write写内容的代码真是看到我晕.
建议你关联document.onmousexxx
然后判断鼠标是否在div里.
phplover 2004-05-09
  • 打赏
  • 举报
 回复
to 楼上：
我这里ie6没有那个问题
joe820302 2004-05-09
  • 打赏
  • 举报
 回复
好象IE6里也存在第1个问题啊！
程序里逻辑有点问题吧。
我一般在第1层的ONMOUSEOUT事件之后的closeMenu()函数里会放个计时器（全局变量），约1秒种后关闭。
在这一秒之内，如果鼠标移到第2层菜单上，则计时器清零，closeMenu()返回失败；如果鼠标移到body中其他对象上，菜单才会真的隐藏。
phplover 2004-05-09
  • 打赏
  • 举报
 回复
高手在哪里？？？

主要剩下第一问题，拜托各位了
phplover 2004-05-09
  • 打赏
  • 举报
 回复
得到saucer大虾的帮助第三个问题解决了：
function closeMenu()
{
if (event.toElement.tagName != "IFRAME")
menuDiv.style.display = "none";
}

制作Help菜单
介绍如何制作Help菜单
help sb (to) do something & help sb (in) doing sth
help sb do sth与help sb doing sth　　 　　 一、关于 help sb do sth　　 help sb do sth是大家比较熟悉的结构，通常也可说成help sb to do sth，其意为 “帮助某人做某事”，两者常可通用——即其中的不定式符号to可以省略，也可以保留。如：　　 We helped her (to) find her things. 我们帮她找
已解决chatgpt报错出了些问题。如果此问题仍然存在，请通过我们的帮助中心 help.openai.com 与我们联系。
已解决chatgpt报错出了些问题。如果此问题仍然存在，请通过我们的帮助中心 help.openai.com 与我们联系。
python的help怎么用_Python help()函数用法详解
help函数是python的一个内置函数(python的内置函数可以直接调用,无需import)，它是python自带的函数，任何时候都可以被使用。help函数能作什么、怎么使用help函数查看python模块中函数的用法，和使用help函数时需要注意哪些问题，下面来简单的说一下。一、help()函数的作用在使用python来编写代码时，会经常使用python自带函数或模块，一些不常用的函数或是模...
UG二次开发—经典菜单工具条
二次开发-经典菜单与工具条 1.准备工作： 在安装软件的目录下创建文件夹：SZYTOOL，它里面包含至少有application跟setup文件夹 。 application:放置位图，菜单工具条等常规的资源的。 setup:利用application中的资源，亦可以将菜单等放入其中直接用。       _很多名字可以在信息中，UGII中找到。 2.环境变量及添加办法 环境变量有：...
JavaScript

87,907

社区成员

224,614

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章