//使用方法 HEAD 中的 JS, 不用作任何修改, 也几乎没有什么修改的必要. // HEAD中的CSS 根据自己的需要, 可以作任意修改. // 下面的JS, 都写有注释, 可以随便修改定义菜单的语句和使用的样式表名. // var webNav=new navMenuClass(); 这一句要注意, 创建的这个实例必须名为 webNav function createDiv(inObj){ //创建一个DIV var tempObj=document.createElement("div"); obj=inObj.appendChild(tempObj); return obj; } function navMenuClass(){ var m=new Array(); var l=new Array(); this.mainCss=null; //主菜单样式表 this.mainEndCss=null; //最后一个主菜单的样式表 this.mainMouseCss=null; //主菜单鼠标移上去后的样式式表 this.lowCss=null; //子菜单样式表 this.lowMouseCss=null; //子菜单鼠标移上去样式表 this.lowBgCss=null; //子菜单背景样式表 this.lDiv=null; //子菜单的外部DIV this.lDivBG=null; //子菜单的背景DIV this.lDivText=null; //子菜单的DIV this.isClose=0; //是否关半子菜单 this.mainObj=null; // this.z=0; this.addMain=function(text,url) { m[m.length]=text+"|"+url; l[l.length]=new Array(); this.z++; } this.addLow=function(index,text,url) { var x=l[index].length; l[index][x]=new Array(); l[index][x][0]=text; l[index][x][1]=url; } this.create=function(obj){ if (this.mainCss==null){ alert("请定义主菜单的样式");return;} if (this.lowCss==null){ alert("请定义子菜单的样式");return;} if (this.lowMouseCss==null){ alert("请定义子菜单鼠标移上去后的菜单的样式");return;} if (this.lowBgCss==null){ alert("请定义子菜单背景的样式");return;} if (obj==null){ alert("请设置把菜单显示到哪个对象中");return;} if (m.length==0){alert("请你设置好主菜单");return;} if (l.length==0){alert("请你设置好子菜单");return;} this.lDiv=createDiv(document.body); this.lDivBG=createDiv(this.lDiv); this.lDivText=createDiv(this.lDiv); this.lDiv.style.cssText="position: absolute; z-index: 1; left: 0px; top: 0px;display:none"; this.lDivBG.style.cssText="position: absolute; z-index: 2; left: 0px; top: 0px;"; this.lDivBG.className=this.lowBgCss; this.lDivText.style.cssText="position: absolute; z-index: 3; left: 0px; top: 0px;"; for (var i=0;i" + mText[0] + ""; mObj.i=i; mObj.onmouseover=function(){ //当鼠标移到主菜单上 webNav.setIsClose; this.className=webNav.mainMouseCss; if (webNav.mainObj!=null & webNav.mainObj!=this){ if (parseInt(webNav.mainObj.i)==webNav.z-1){ webNav.mainObj.className=webNav.mainEndCss; }else{ webNav.mainObj.className=webNav.mainCss; } } webNav.mainObj=this; webNav.createLow(this); //alert(parseInt(webNav.mainObj.i)+"|"+webNav.z); } mObj.onmouseout=function(){ //当鼠标移开主菜单 webNav.timeCloseMenu(); } } this.lDiv.onmouseout=function(){ webNav.timeCloseMenu(); } this.lDiv.onmouseover=function(){ webNav.setIsClose(); } } this.createLow=function(obj){ //return; webNav.setIsClose(); var x=parseInt(obj.i); this.lDiv.style.display="none"; this.lDivText.innerHTML=""; lData=l[x]; var lobj,i; for (i=0;i" + lData[i][0] + ""; lobj.onmouseover=function(){ webNav.setIsClose(); this.className=webNav.lowMouseCss; } lobj.onmouseout=function(){ webNav.timeCloseMenu(); this.className=webNav.lowCss; } } var y=getTop(obj)+obj.offsetHeight; // var y=getTop(obj); var x=getLeft(obj); this.lDiv.style.top=y; this.lDiv.style.left=x; this.lDivBG.style.height=(25*i)+"px"; if (i!=0){ this.lDiv.style.display=""; } } this.setIsClose=function(){ this.isClose=0; } this.timeCloseMenu=function(){ //延时后关闭菜单 this.isClose=1; setTimeout("webNav.closeMenu()",500); } this.closeMenu=function(){ if (this.isClose==1){ this.lDiv.style.display="none"; if (this.mainObj!=null){ //alert(parseInt(this.mainObj.i)+"|"+m.length) if (parseInt(this.mainObj.i)==m.length-1){ this.mainObj.className=this.mainEndCss; }else{ this.mainObj.className=this.mainCss; } } } } } var webNav=new navMenuClass(); function createMenu(){ webNav.mainCss="mCss"; //主菜单样式表 webNav.mainEndCss="mEndCss"; //主菜单最后个的样式表 webNav.mainMouseCss="mCss1" //主菜单鼠标移上去后的样式表 webNav.lowCss="lCss"; //子菜单样式表 webNav.lowMouseCss="lCss1"; //子菜单鼠标移上去样式表 webNav.lowBgCss="lbgCss"; //子菜单背景样式表 webNav.addMain("关于我们","ListGYWM.aspx?page=1&menuid=1292"); //定义第一个主菜单 webNav.addMain("集团概览","list.aspx?page=1&menuid=1293"); //定义第二个主菜单 webNav.addMain("跨国经营","list.aspx?page=1&menuid=1294"); //定义第三个主菜单 webNav.addMain("公司新闻","list.aspx?page=1&menuid=1295"); webNav.addMain("人力资源","list.aspx?page=1&menuid=1296"); webNav.addMain("企业文化","list.aspx?page=1&menuid=1297"); webNav.addMain("党群工作","list.aspx?page=1&menuid=1298"); webNav.addLow(0,"公司简介","article.aspx?menuid=1292&tab=tab_News&tabid=5") webNav.addLow(0,"高层致辞","article.aspx?menuid=1292&tab=tab_News&tabid=4") webNav.addLow(0,"管理团队","article.aspx?menuid=1292&tab=tab_News&tabid=3") webNav.addLow(0,"公司机构","article.aspx?menuid=1292&tab=tab_News&tabid=2") webNav.addLow(0,"大 事 记","listB.aspx?page=1&menuid=1303") webNav.addLow(1,"集团介绍","listB.aspx?page=1&menuid=1304") ////定义第二个主菜单的子菜单 webNav.addLow(1,"工程展示","project.aspx?page=1&menuid=1305") webNav.addLow(1,"多元发展","listB.aspx?page=1&menuid=1306") webNav.addLow(1,"科学技术","Development.aspx?page=1&menuid=1322") webNav.addLow(2,"水利水电","listB.aspx?page=1&menuid=1321") webNav.addLow(2,"公路桥梁","listB.aspx?page=1&menuid=1325") webNav.addLow(2,"供水工程","listB.aspx?page=1&menuid=1326") webNav.addLow(2,"市政建设","listB.aspx?page=1&menuid=1327") webNav.addLow(2,"其他项目","listB.aspx?page=1&menuid=1328") webNav.addLow(3,"企业要闻","listB.aspx?page=1&menuid=1329") webNav.addLow(3,"国内在建","listB.aspx?page=1&menuid=1330") webNav.addLow(3,"国际在建","listB.aspx?page=1&menuid=1331") webNav.addLow(3,"媒体关注","listB.aspx?page=1&menuid=1332") webNav.addLow(3,"图片新闻","listB.aspx?page=1&menuid=1333") webNav.addLow(4,"人才招聘","listB.aspx?page=1&menuid=1334") webNav.addLow(4,"人事制度","listB.aspx?page=1&menuid=1335") webNav.addLow(4,"教育培训","listB.aspx?page=1&menuid=1336") webNav.addLow(4,"优秀员工","listB.aspx?page=1&menuid=1337") webNav.addLow(5,"文化活动","listB.aspx?page=1&menuid=1338") webNav.addLow(5,"文化理念","listB.aspx?page=1&menuid=1339") webNav.addLow(5,"员工手册","shouce/shouce.html?page=1&menuid=1359") webNav.addLow(5,"企业V I","listB.aspx?page=1&menuid=1341") webNav.addLow(5,"礼宾知识","listB.aspx?page=1&menuid=1342") webNav.addLow(5,"营地风情","listB.aspx?page=1&menuid=1343") webNav.addLow(6,"党建工作","listB.aspx?page=1&menuid=1344") webNav.addLow(6,"纪律监察","listB.aspx?page=1&menuid=1345") webNav.addLow(6,"群团工作","listB.aspx?page=1&menuid=1346") webNav.addLow(6,"文明创建","listB.aspx?page=1&menuid=1349") webNav.addLow(6,"普法工作","listB.aspx?page=1&menuid=1365") webNav.create(navDiv); //把定义好的菜单添加到 ID 为 navDiv 的这个DIV, 这个名字可以随便取. 只要页面中有这个DIV 就可以. }