谢谢各位了 去http://www.pconline.com.cn看看，他们的网页上有下拉菜单，希望能对你有帮助。 解决方案 » 免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货 <DIV ID='pad' ……> <A ID='pad1' onmouseout="mouseout(); hideMenu();" onmouseover="mouseover(); doMenu('idpad1');" onclick="window.event.returnValue=false;">菜单项一</A> <A ID='pad2' onmouseout="mouseout(); hideMenu();" onmouseover="mouseover(); doMenu('idpad2');" onclick="window.event.returnValue=false;">菜单项二</A> …… </DIV> 接着，我们根据主菜单条的个数定义相应的子菜单，为每个子菜单定义一个区域，该区域中第一个元素是一条横线，然后每个子菜单作为一个超链接置于该区域中，由于子菜单纵向排列，每个超链接后加<BR>换行。当然这个区域现在还不能显示出来，但当它被激活时，其显示位置应位于其他对象之上，所以其style属性置为STYLE=' display:none; z-index:9;'。 注意每个超链接的ID均应与其主菜单的ID相同，以便于统一处理。格式见程序2。 <SPAN ID='idpad1' STYLE='display:none; z-index:9;' onmouseout='hideMenu();'> <HR STYLE='position:absolute;left:0;top:0;color:white' SIZE=1> <DIV > <A ID='pad1' HREF='11.htm' onmouseout="mouseout();" onmouseover="mouseover()"> 子菜单项一一</A><BR> <A ID='pad1' HREF='12.htm' onmouseout="mouseout();" onmouseover="mouseover()"> 子菜单项一二</A><BR> <HR STYLE='color:white' SIZE=1><!--如有必要可以用横线对子菜单分组--> <A ID='pad1' HREF='13.htm' onmouseout="mouseout();" onmouseover="mouseover()"> 子菜单项一三</A><BR> …… </DIV> </SPAN> 经过上面的步骤，下拉菜单的格式已经定义好了，下面的任务就是控制这些子菜单的显示和隐藏。 当鼠标移动到主菜单条上时，应显示其子菜单，我们通过执行doMenu(MenuID)响应主菜单的onmouseover事件来完成。过程的参数MenuID是代表子菜单的区域的ID，过程执行时先设置window.event. cancelBubble = true，并计算子菜单显示的位置，包括左上角和右下角坐标。然后执行下列语句来显示子菜单所在区域： CurMenu.style.clip = "rect(0 0 0 0) ";CurMenu.style.display = "block"; 当鼠标移出主菜单时有两种情况，一种情况是鼠标在子菜单及其主菜单之间移动，这时不能隐藏子菜单；另一种情况是鼠标移出了子菜单及其主菜单的区域，这时需要隐藏子菜单。我们通过执行hideMenu()响应主菜单的onmouseout，同时执行hideMenu()响应子菜单所在区域的onmouseout事件来完成。 网页中的另外两个函数mouseout() 和mouseover() 的功能很简单，分别用于处理鼠标移动时菜单项的颜色变化。 完整的源代码参见《电子与电脑》网站www.pccomputing.com.cn。 网页浏览的效果如图1所示，运行环境为IE4.0以上版本。 （图注WANGYE） 图1 <HTML> <HEAD> <TITLE>网页中的下拉菜单</TITLE> </HEAD> <SCRIPT LANGUAGE="JavaScript" > var IsDroped =false; function mouseout() { window.event.srcElement.style.color = 'white';//鼠标移开时置为白色 } function mouseover() { window.event.srcElement.style.color = 'red';//鼠标进入时置为红色//鼠标进入时置为红色 } function doMenu(MenuID) { var CurMenu = document.all(MenuID); //为避免闪烁,如果下拉菜单已经显示则不重画. if (IsDroped==true) { window.event.cancelBubble = true; return false; } window.event.cancelBubble = true; TempMenu = CurMenu; //计算下拉菜单的位置 x = window.event.srcElement.offsetLeft + window.event.srcElement.offsetParent.offsetLeft; x2 = x + window.event.srcElement.offsetWidth; y = pad.offsetHeight; CurMenu.style.top = y; CurMenu.style.left = x; CurMenu.style.clip = "rect(0 0 0 0)"; CurMenu.style.display = "block"; //延时2毫秒后再显示菜单,保证ToolbarMenu.offsetHeight有值,避免从主菜单移向下拉菜单时下拉菜单消失. window.setTimeout("showMenu()", 2); return true; } function showMenu() { y2 = y + TempMenu.offsetHeight; TempMenu.style.clip = "rect(auto auto auto auto)"; IsDroped =true;//下拉菜单已经显示 } function hideMenu() { //如果在下拉菜单的范围之内移动则不隐藏. cY = event.clientY + document.body.scrollTop; if (cY>=y && cY<y2 && event.clientX >= (x+5) && event.clientX <= x2 || cY>1 && cY<y && event.clientX >= (x+5) && event.clientX <= x2-10) { window.event.cancelBubble = true; return;} //隐藏 TempMenu.style.display = "none"; window.event.cancelBubble = true; IsDroped =false; } </SCRIPT> <body topmargin=0 leftmargin=0 marginheight=0 marginwidth=0> <DIV ID='menu' STYLE='position:absolute;background-color:white;width:100%;top:0;left:0;'> <DIV ID='pad' STYLE='position:relative;height:20;width:100%;font:bold 11pt 宋体;background-color:#007FFF;color:white;'> <A TARGET='_top' TITLE='' ID='pad1' onmouseout="mouseout(); hideMenu();" onmouseover="mouseover(); doMenu('idpad1');"> 菜单项一 </A> <SPAN style="color:white"> </SPAN> <A TARGET='_top' TITLE='' ID='pad2' onmouseout="mouseout(); hideMenu();" onmouseover="mouseover(); doMenu('idpad2');" onclick="window.event.returnValue=false;"> 菜单项二 </A> </DIV> </DIV> <SPAN ID='idpad1' STYLE='display:none;position:absolute;width:140;background-color:#007FFF;padding-top:0;padding-left:0;padding-bottom:20;z-index:9;' onmouseout='hideMenu();'> <HR STYLE='position:absolute;left:0;top:0;color:white' SIZE=1> <DIV STYLE='position:relative;left:0;top:8;'> <A ID='pad1' STYLE='text-decoration:none;cursor:hand;font:bold 11pt 宋体;color:white' HREF='11.htm' TARGET='_top' onmouseout="mouseout();" onmouseover="mouseover()"> 子菜单项一一 </A><BR> <A ID='pad1' STYLE='text-decoration:none;cursor:hand;font:bold 11pt 宋体;color:white' HREF='12.htm' TARGET='_top' onmouseout="mouseout();" onmouseover="mouseover()"> 子菜单项一二 </A><BR> <A ID='pad1' STYLE='text-decoration:none;cursor:hand;font:bold 11pt 宋体;color:white' HREF='13.htm' TARGET='_top' onmouseout="mouseout();" onmouseover="mouseover()"> 子菜单项一三 </A> </DIV> </SPAN> <SPAN ID='idpad2' STYLE='display:none;position:absolute;width:140;background-color:#007FFF;padding-top:0;padding-left:0;padding-bottom:20;z-index:9;' onmouseout='hideMenu();'> <HR STYLE='position:absolute;left:0;top:0;color:white' SIZE=1> <DIV STYLE='position:relative;left:0;top:8;'> <A ID='pad2' STYLE='text-decoration:none;cursor:hand;font:bold 11pt 宋体;color:white' HREF='21.htm' TARGET='_top' onmouseout="mouseout();" onmouseover="mouseover()"> 子菜单项二一</A><BR> <A ID='pad2' STYLE='text-decoration:none;cursor:hand;font:bold 11pt 宋体;color:white' HREF='22.htm' TARGET='_top' onmouseout="mouseout();" onmouseover="mouseover()"> 子菜单项二二</A><BR> <A ID='pad2' STYLE='text-decoration:none;cursor:hand;font:bold 11pt 宋体;color:white' HREF='23.htm' TARGET='_top' onmouseout="mouseout();" onmouseover="mouseover()"> 子菜单项二三</A><BR> <HR STYLE='color:white' SIZE=1><!--分隔行--> <A ID='pad2' STYLE='text-decoration:none;cursor:hand;font:bold 11pt 宋体;color:white' onclick="parent.close()" onmouseout="mouseout();" onmouseover="mouseover()"> 退出系统</A> </DIV> </SPAN> <!--页面的其它内容--> </BODY> </HTML> 求助：属性的值设置 今天重装系统后,再装java虚拟机时有问题?? 如何逐行读取文件内容,并找出其中是否存在要找的字符串(请高手帮忙给高分) 关于HasMap的问题 请准确结分 如何把JAVA程序设置成后台运行？ 我用输出流向文件中写数据，数据只能在一行上连续的写。我想在第二行写数据该用什么方法实现？ 关于运行JAR文件出现乱码的问题 谁能帮我解释一下下面的程序。。。。。。。。 怎样用Java连SqlServer2000? 急！哪位大哥help me…… 帮帮小弟吧，mouseDragged()过程中怎样画图？
解决方案 »
免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货