Tip: you can modify some code before running
<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>Very good navigation menu similar to Windows</title></head><body><SCRIPT language="jscript.encode">Var mmenus = new Array (); var misShow = new Boolean (); misShow = false; var misdown = new Boolean (); misdown = false; var musestatus = false; var mpopTimer = 0; // There are too many parameters below. You can modify the following parameters one by one until you find the satisfied style mmenucolor = '# FFE1F5'; mfontcolor = 'menutext '; mmenuoutcolor = '# FFE1F5'; mmenuincolor = '# FFE1F5'; mmenuoutbordercolor = '# FFFFFF'; mmenuinbordercolor =' #000000 '; mmidoutcolor =' # E2DFDA '; mmidincolor = '#8D8A85'; mmenuovercolor = 'menutext' ; Mitemedge = '1'; msubedge = '1'; mmenuunitwidth = 50; mmenuitemwidth = 100; mmenuheight = 22; mmenuwidth = '000000'; mmenuadjust = 0; mmenuadjustV = 0; mfonts = 'font-family:; font-size: 9pt; color: MenuText; '; mcursor = 'default'; var fadeSteps = 15; var fademsec = 100; // modify the display speed var fadeArray = new Array (); function fade (el, fadeIn, steps, msec) {if (steps = null) steps = fadeSteps; if (msec = null) msec = fademsec; if (el. fade Index = null) el. fadeIndex = fadeArray. length; fadeArray [el. fadeIndex] = el; if (el. fadeStepNumber = null) {if (el. style. visibility = "hidden") el. fadeStepNumber = 0; elseel. fadeStepNumber = steps; if (fadeIn) el. style. filter = "Alpha (Opacity = 0)"; elseel. style. filter = "Alpha (Opacity = 100)";} window. setTimeout ("repeatFade (" + fadeIn + "," + el. fadeIndex + "," + steps + "," + msec + ")", msec);} function r EpeatFade (fadeIn, index, steps, msec) {el = fadeArray [index]; c = el. fadeStepNumber; if (el. fadeTimer! = Null) window. clearTimeout (el. fadeTimer); if (c = 0 )&&(! FadeIn) {el. style. visibility = "hidden"; return;} else if (c = steps) & (fadeIn) {el. style. filter = ""; el. style. visibility = "visible"; return;} else {(fadeIn )? C ++: c --; el. style. visibility = "visible"; el. style. filter = "Alpha (Opacity =" + 100 * c/steps + ")"; el. fadeStepNumber = c; el. fadeTimer = window. setTimeout ("repeatFade (" + fadeIn + "," + index + "," + steps + "," + msec + ")", msec) ;}} function stoperror () {return true;} window. onerror = stoperror; function mpopOut () {mpopTimer = setTimeout ('mallhide () ', 500);} function getReal (el, type, value) {temp = el; wh Ile (temp! = Null) & (temp. tagName! = "BODY") {if (eval ("temp. "+ type) = value) {el = temp; return el;} temp = temp. parentElement;} return el;} function mMenuRegister (menu) {mmenus [mmenus. length] = menu return (mmenus. length-1)} function compute get = target; this. isline = isline; this. statustxt = statustxt; this. img = img; this. sizex = sizex; this. sizey = sizey; this. pos = pos;} function mMenu (caption, command, target, img, sizex, sizey, pos) {this. items = new array(~~this.caption?caption=this.command?command=this.tar get = target; this. img = img; this. sizex = sizex; this. sizey = sizey; this. pos = pos; this. id = mMenuRegister (this);} function mMenuAddItem (item) {this. items [this. items. length] = item. parent = this. id; this. children = true;} mMenu. prototype. addItem = mMenuAddItem; function mtoout (src) {src. style. borderLeftColor = mmenuoutbordercolor; src. style. borderRightColor = mmenuinbordercolor; src. style. borderTopColor = mmenuoutbordercolor; src. style. borderBottomColor = mmenuinbordercolor; src. style. backgroundColor = mmenuoutcolor; src. style. color = mmenuovercolor;} function mtoin (src) {src. style. borderLeftColor = mmenuinbordercolor; src. style. borderRightColor = mmenuoutbordercolor; src. style. borderTopColor = mmenuinbordercolor; src. style. borderBottomColor = mmenuoutbordercolor; src. style. backgroundColor = mmenuincolor; src. style. color = mmenuovercolor;} function mnochange (src) {src. style. borderLeftColor = mmenucolor; src. style. borderRightColor = mmenucolor; src. style. borderTopColor = mmenucolor; src. style. borderBottomColor = mmenucolor; src. style. backgroundColor = ''; src. style. color = mfontcolor;} function mallhide () {for (var nummenu = 0; nummenu<mmenus.length;nummenu++){var themenu=document.all['mMenu'+nummenu]var themenudiv=document.all['mmenudiv'+nummenu] mnochange(themenu); mmenuhide(themenudiv); }}function mmenuhide(menuid){fade(menuid,false,5);misShow=false;}function mmenushow(menuid,pid){menuid.style.left=mposflag.offsetLeft+pid.offsetLeft+mmenuadjust;menuid.style.top=mposflag.offsetTop+mmenutable.offsetHeight+mmenuadjustV;if(mmenuitemwidth+parseInt(menuid.style.left)>Document. body. clientWidth + document. body. scrollLeft) menuid. style. left = document. body. clientWidth + document. body. scrollLeft-mmenuitemwidth; fade (menuid, true, 5); misShow = true;} function mmenu_over (menuid, x) {toel = getReal (window. event. toElement, "className", "coolButton"); fromel = getReal (window. event. fromElement, "className", "coolButton"); if (toel = fromel) return; if (x = 0 | x = 4) {misShow = false; mallhi De (); mtoout (eval ("mMenu" + x);} else {mallhide (); mtoin (eval ("mMenu" + x); mmenushow (menuid, eval ("mMenu" + x);} clearTimeout (mpopTimer);} function mmenu_out (x) {toel = getReal (window. event. toElement, "className", "coolButton"); fromel = getReal (window. event. fromElement, "className", "coolButton"); if (toel = fromel) return; if (misShow) {mtoin (eval ("mMenu" + x ));} else {mnochange (eval ("mMenu" + x);} mpopOut ()} fu Nction mmenu_down (menuid, x) {if (misShow) {mmenuhide (menuid); mtoout (eval ("mMenu" + x ));} else {mtoin (eval ("mMenu" + x); mmenushow (menuid, eval ("mMenu" + x); misdown = true ;}} function mmenu_up () {misdown = false;} function mmenuitem_over (x, I) {srcel = getReal (window. event. srcElement, "className", "coolButton"); if (misdown) {mtoin (srcel);} else {mtoout (srcel);} mthestatus = mmenus [x]. items [I]. statustxt; if (mthesta Tus! = "") {Musestatus = true; window. status = mthestatus;} clearTimeout (mpopTimer);} function mmenuitem_out () {srcel = getReal (window. event. srcElement, "className", "coolButton"); mnochange (srcel); if (musestatus) window. status = ""; mpopOut ()} function mmenuitem_down () {srcel = getReal (window. event. srcElement, "className", "coolButton"); mtoin (srcel) misdown = true;} function mmenuitem_up () {srcel = getReal (window. event. srcElement, "className", "coolButton"); mtoout (srcel) misdown = false;} function mexec2 (x) {var implements if(mmenus%x%.tar get = "blank ") {cmd = "window. open ('"+ mmenus [x]. command + "')";} else {cmd = mmenus?x=.tar get + ". location = "" + mmenus [x]. command + "";} eval (cmd);} function mexec (x, I) {var variable if(mmenus%x%.items% I %.tar get = "blank") {cmd = "window. open ('"+ mmenus [x]. items [I]. command + "')";} else {cmd = mmenus?x=.items= I =.tar get + ". location = "" + mmenus [x]. items [I]. command + "";} eval (cmd);} function mbody_click () {if (misShow) {srcel = getReal (window. event. srcElement, "className", "coolButton"); for (var x = 0; x <= mmenus. length; x ++) {if (srcel. id = "mMenu" + x) return;} mallhide () ;}} document. onclick = mbody_click; function mwritetodocument () {var mwb = 1; var stringx ='<div id="mposflag" ></div><table id=mmenutable border=0 cellpadding=3 cellspacing=2 width='+mmenuwidth+' height='+mmenuheight+' bgcolor='+mmenucolor+ ' onselectstart="event.returnValue=false"'+ ' +mcursor+';'+mfonts+ ' border-left: '+mwb+'px solid '+mmenuoutbordercolor+';'+ ' border-right: '+mwb+'px solid '+mmenuinbordercolor+'; '+ 'border-top: '+mwb+'px solid '+mmenuoutbordercolor+'; '+ 'border-bottom: '+mwb+'px solid '+mmenuinbordercolor+'; padding:0px"><tr>' for(var x=0;x<mmenus.length;x++){ var thismenu=mmenus[x]; var imgsize=""; if(thismenu.sizex!="0"||thismenu.sizey!="0")imgsize=" width="+thismenu.sizex+" height="+thismenu.sizey; var ifspace=""; if(thismenu.caption!="")ifspace=" "; stringx += "<td nowrap class=coolButton id=mMenu"+x+" +mitemedge+"px solid "+mmenucolor+ "' width="+mmenuunitwidth+"px onmouseover=mmenu_over(mmenudiv"+x+ ","+x+") onmouseout=mmenu_out("+x+ ") onmousedown=mmenu_down(mmenudiv"+x+","+x+")"; if(thismenu.command!=""){ stringx += " onmouseup=mmenu_up();mexec2("+x+");"; }else{ stringx += " onmouseup=mmenu_up()"; } if(thismenu.pos=="0"){ stringx += " align=center>"+ifspace+thismenu.caption+"</td>"; }else if(thismenu.pos=="1"){ stringx += " align=center>"+thismenu.caption+ifspace+"</td>"; }else if(thismenu.pos=="2"){ stringx += " align=center background='"+thismenu.img+"'> "+thismenu.caption+" </td>"; }else{ stringx += " align=center> "+thismenu.caption+" </td>"; } stringx += ""; } stringx+="<td width=*> </td></tr></table>"; for(var x=0;x<mmenus.length;x++){ thismenu=mmenus[x]; if(x==0||x==4){ stringx+='<div id=mmenudiv'+x+' ></div>';} Else {stringx + ='<div id=mmenudiv'+x+ ' +mcursor+';position:absolute;'+ 'width:'+mmenuitemwidth+'px; z-index:'+(x+100); if(mmenuinbordercolor!=mmenuoutbordercolor&&msubedge=="0"){ stringx+=';border-left: 1px solid '+mmidoutcolor+ ';border-top: 1px solid '+mmidoutcolor;} stringx+=';border-right: 1px solid '+mmenuinbordercolor+ ';border-bottom: 1px solid '+mmenuinbordercolor+';visibility:hidden" onselectstart="event.returnValue=false">n'+ '<table width="100%" border="0" height="100%" align="center" cellpadding="0" cellspacing="2" '+ ' +mfonts+' border-left: 1px solid '+mmenuoutbordercolor; if(mmenuinbordercolor!=mmenuoutbordercolor&&msubedge=="0"){ stringx+=';border-right: 1px solid '+mmidincolor+ ';border-bottom: 1px solid '+mmidincolor;} stringx+=';border-top: 1px solid '+mmenuoutbordercolor+ ';padding: 4px" bgcolor='+mmenucolor+'>N' for (var I = 0; I<thismenu.items.length;i++){ var thismenuitem=thismenu.items[i]; var imgsize=""; if(thismenuitem.sizex!="0"||thismenuitem.sizey!="0")imgsize=" width="+thismenuitem.sizex+" height="+thismenuitem.sizey; var ifspace=""; if(thismenu.caption!="")ifspace=" "; if(!thismenuitem.isline){ stringx += "<tr><td class=coolButton +mitemedge+"px solid "+mmenucolor+ "' width=100% height=15px onmouseover="mmenuitem_over("+x+","+i+ ");" onmouseout=mmenuitem_out() onmousedown=mmenuitem_down() onmouseup="; stringx += "mmenuitem_up();mexec("+x+","+i+"); "; if(thismenuitem.pos=="0"){ stringx += ">"+ Ifspace + thismenuitem. caption +"</td></tr>";} Else if (thismenuitem. pos =" 1 ") {stringx + ="> "+ thismenuitem. caption + ifspace +"</td></tr>";} Else if (thismenuitem. pos =" 2 ") {stringx + =" background = '"+ thismenuitem. img +"'> "+ thismenuitem. caption +"</td></tr>";} Else {stringx + ="> "+ thismenuitem. caption +"</td></tr>";}} Else {stringx + ='<tr><td height="1" background="hr.gif" onmousemove="clearTimeout(mpopTimer);"></td></tr>N' ;}} stringx + ='</table>N</div>'} Document. write ("<div align='left'>"+ Stringx +"</div>");} Mpmenu1 = new mMenu ('back to homepage ',' # ', 'self ','','','',''); mpmenu2 = new mMenu ('webpage maker ', '', 'self','', ''); mpmenu2.addItem (new mMenuItem ('character Gallery ', '#', 'self ', false, ''); mpmenu2.addItem (new mMenuItem ('Landscape Gallery ', '#', 'self ', false, ''); mpmenu2.addItem (new mMenuItem ('Flowers and plants Gallery ', '#', 'self ', false, ''); mpmenu2.addItem (new mMenuItem ('other image ', '#', 'self ', false, ''); mpmenu3 = new mMenu ('webpage times ', '#', 'self ', ''); mpmenu3.addItem (new mMenuItem ('line Gallery', '#', 'self ', false, '',''); mpmenu3.addItem (new mMenuItem ('Button Gallery ',' # ', 'self', false, '',''); mpmenu3.addItem (new mMenuItem ('other image', '#', 'self ', false ,'', '',''); mpmenu4 = new mMenu ('webpage learn', '#', 'self ','','', '',''); mpmenu4.addItem (new mMenuItem ('design basis ',' # ', 'self', false ,'','','','', ''); mpmenu4.addItem (new mMenuItem ('asp article', '#', 'self ', false ,'','','','', ''); mpmenu4.addItem (new mMenuItem ('php article', '#', 'self ', false ,'','','','', ''); mpmenu4.addItem (new mMenuItem ('Design upgrade', '#', 'self ', false ,'','','','', ''); mpmenu4 = new mMenu ('webpage effect ',' # ', 'self',''); mwritetodocument ();</sCRIPT></body></html>
Tip: you can modify some code before running
