Español
<!-- 把如下代码加入<cuerpo>区域中 --> <!-- web http://www.downcodes.com --> <!-- bbs http://www.downcodes.com/bbs- -> <estilo rel=tipo de hoja de estilo=text/css> CUERPO { BORDE-ABAJO: 0px; FRONTERA IZQUIERDA: 0px; BORDE DERECHO: 0px; BORDE SUPERIOR: 0px; MARGEN: 0px; color: texto del botón } #menú { FONDO: cara del botón; BORDE INFERIOR: cara del botón 1px sólido; FRONTERA IZQUIERDA: cara del botón 1px sólido; BORDE DERECHO: botón de 1 px sólido; BORDE SUPERIOR: botón de 1 px sólido; CURSOR: predeterminado; IZQUIERDA: 0px; POSICIÓN: absoluta; ARRIBA: 0px } #menú .menu { FONDO: botón; BORDE INFERIOR: botón resaltado 2px de inicio; FRONTERA IZQUIERDA: botón resaltado 2px de inicio; BORDE DERECHO: botón resaltado 2px de inicio; BORDER-TOP: botón resaltado 2px de inicio; POSICIÓN: absoluta } #menu TD { FUENTE: menú; ALTURA: 20px } #menu .root { BORDE INFERIOR: cara del botón 1px sólido; FRONTERA IZQUIERDA: cara del botón 1px sólido; BORDE DERECHO: botón de 1 px sólido; BORDE SUPERIOR: botón de 1 px sólido; MARGEN: 6px; RELLENO INFERIOR: 1px; RELLENO IZQUIERDO: 7px; RELLENO-DERECHA: 7px; PADDING-TOP: 1px } #menu .icon { TEXT-ALIGN: center } #menu .disabled { COLOR: buttonshadow } #menu .more { FONT-FAMILY: webdings; ALINEAR TEXTO: derecha; ANCHO: 20px } #menu #handle { BORDE INFERIOR: sombra de botón 1px sólido; BORDE IZQUIERDO: botón resaltado 1px sólido; BORDE DERECHO: sombra de botón 1px sólida; BORDE SUPERIOR: botón resaltado 1px sólido; CURSOR: mover; MARGEN: 0px; RELLENO INFERIOR: 0px; PADDING-IZQUIERDO: 0px; PADDING-DERECHA: 0px; PADDING-TOP: 0px } #outerDiv { BORDE-BOTTOM: recuadro blanco de 2px; FRONTERA IZQUIERDA: recuadro blanco de 2px; BORDE DERECHO: recuadro blanco de 2px; BORDE SUPERIOR: recuadro blanco de 2px; ALTURA: 90%; DESBORDAMIENTO: automático; POSICIÓN: absoluta; ANCHO: 100%; ÍNDICE Z: -1 } </style> <SCRIPT> var activeMenu = null; var activeSub = nulo; var tempEl; var t; var hideWindowedControls = verdadero; var ie5 = (document.getElementsByTagName! = nulo); función menuItemHighlight(el) { el.style.background = "resaltar"; el.style.color = "texto resaltado"; } función menuItemNormal(el) { el.style.background = ""; el.estilo.color = ""; } function riseButton(el) { el.style.borderTop ="1 botón resaltado sólido"; el.style.borderLeft ="1 botón sólido resaltado"; el.style.borderBottom ="1 sombra de botón sólida"; el.style.borderRight ="1 sombra de botón sólida"; el.style.padding="1"; el.style.paddingLeft = "7"; el.style.paddingRight = "7"; } function normalButton(el) { el.style.border = "1 botón sólido"; el.style.padding="1"; el.style.paddingLeft = "7"; el.style.paddingRight = "7"; } función botón presionado(el) { el.style.borderTop ="1 sombra de botón sólida"; el.style.paddingTop = "2"; el.style.borderLeft ="1 sombra de botón sólida"; el.style.paddingLeft = "8"; el.style.borderBottom ="1 botón sólido resaltado"; el.style.paddingBottom= "0"; el.style.borderRight = "1 botón sólido resaltado"; el.style.paddingRight = "6"; } función cleanUpMenuBar() { para (i=0; i <menu.rows.length; i++) { para (j=0; j <menu.rows(i).cells.length; j++) { if (menu.rows (i).cells(j).className == "raíz") { normalButton(menu.rows(i).cells(j)); } } } showWindowedObjects(verdadero); } función getMenuItem(el) { temp = el; mientras ((temp!=null) && (temp.tagName!="TABLE") && (temp.id!="barra de menú") && (temp.id!="menú") && (temp.id!="handle ")) { if ((temp.tagName=="TR") || (temp.className=="raíz")) el = temp; temp = temp.parentElement; } devolver el; } función getSub(el) { temp = el; while ((temp!=null) && (temp.className != "sub")) { if (temp.tagName=="TABLE") el = temp; temp = temp.parentElement; } devolver el; } función menuClick() { if (event.srcElement == null) return; var el=getMenuItem(event.srcElement); if ((el.className! = "disabled") && (el.id! = "barra de menú")){ if (el.className == "root") { if (activeMenu) { riseButton(el); mostrarWindowedObjects(verdadero); } más botón presionado(el); alternarMenú(el); } else if (el.href) { cleanUpMenuBar(); si (activeMenu) toggleMenu(activeMenu.parentElement); si (el.target) ventana.open(el.href, el.target); else if (document.all.tags("BASE").item(0) != null) window.open(el.href, document.all.tags("BASE").item(0).target); else ventana.ubicación = el.href; } } ventana.event.cancelBubble = verdadero; } función Restaurar() { if (activeMenu) { toggleMenu(activeMenu.parentElement); limpiarBarraMenú(); } } document.onclick=Restaurar; función menuOver() { if ((event.fromElement == null) || (event.toElement == null) || (event.fromElement == event.toElement)) retorno; var fromEl = getMenuItem(event.fromElement); var toEl = getMenuItem(event.toElement); si (deEl == aEl) regresa; if ((toEl.className != "disabled") && (toEl.id != "menubar")){ if (toEl.className == "root") { if (activeMenu) { if (toEl.menu!= activeMenu ) { limpiarMenuBar(); Botón presionado(aEl); alternarMenú(aEl); } } else { levantarBotón(toEl); } } else { if ((fromEl != toEl) && (toEl.tagName != "TABLE")){ cleanup(toEl.parentElement.parentElement, false); menuItemHighlight(aEl); toEl.parentElement.parentElement.activeItem = toEl; if (toEl.href) ventana.status = toEl.href; if (toEl.className == "sub") showSubMenu(toEl,true); } } } } función menuOut() { if ((event.fromElement == null) || (event.toElement == null) || (event.fromElement == event.toElement)) return; var fromEl = getMenuItem(event.fromElement); var toEl = getMenuItem(event.toElement); si (deEl == aEl) regresa; if (fromEl.className == "root"){ if (activeMenu) { if (fromEl.menu! = activeMenu) normalButton(fromEl); } else botón normal(deEl); } else { if ((fromEl.className != "disabled") && (fromEl.id != "barra de menú")){ if ((fromEl.className == "sub") && (getSub(toEl) == fromEl. subMenú) || (fromEl.subMenu == toEl.parentElement.parentElement)) retorno; else if ((fromEl.className == "sub")){ limpieza(fromEl.subMenu, true); menuItemNormal(deEl); } else if ((fromEl != toEl) && (fromEl.tagName != "TABLE")) menuItemNormal(fromEl); ventana.status = ""; } } } función alternarMenu(el) { if (el.menu == null) el.menu = getChildren(el); if (el.menu == activeMenu) { if (activeSub) menuItemNormal(activeSub.parentElement.parentElement); limpieza (el.menu, verdadero); menú activo = nulo; activeSub = nulo; // mostrarWindowedObjects(verdadero); } else { if (activeMenu) { cleanup(activeMenu,true); ocultarMenú(menúactivo); } activeMenu = el.menu; var tPos = topPos(el.menu) + menu.offsetHeight; if ((document.body.offsetHeight - tPos) >= el.menu.offsetHeight) { el.menu.style.pixelTop = (es decir,5)? el.offsetHeight + 1 : menú.offsetHeight - el.offsetTop - 2; directorio = 2; } else { el.menu.style.pixelTop = (es decir,5)? el.offsetTop - el.menu.offsetHeight - 1 : el.offsetTop - el.menu.offsetHeight + 2; directorio = 8; } el.menu.style.pixelLeft = (es decir,5)? el.offsetIzquierda - 2 : el.offsetIzquierda; mostrar(el.menú, dir); mostrarWindowedObjects(falso); } } función mostrarSubMenu(el,mostrar) { var dir = 2; temperatura = el; lista = el.children.tags("TD"); el = lista[lista.longitud-1]; if (el.menu == null) el.menu = getChildren(el); temp.subMenu = el.menu; if ((el.menu != activeMenu) && (mostrar)) { activeSub = el.menu; var lPos = leftPos(el.menu); if ((document.body.offsetWidth - lPos) >= el.menu.offsetWidth) { el.menu.style.left = (es decir,5)? el.parentNode.offsetWidth: el.offsetParent.offsetWidth; directorio = 6; } else { el.menu.style.left = - el.menu.offsetWidth + 3; directorio = 4; } var tPos = (es decir,5)? topPos(el.menu) + el.offsetTop : topPos(el.menu) + el.offsetParent.offsetTop;// + el.menu.offsetTop; if ((document.body.offsetHeight - tPos) >= el.menu.offsetHeight) el.menu.style.top = (es decir,5)? el.offsetTop - 4 : el.offsetParent.offsetTop - 2; más el.menu.style.top = (es decir,5)? el.offsetTop + el.offsetHeight - el.menu.offsetHeight : el.offsetParent.offsetTop + el.offsetParent.offsetHeight - el.menu.offsetHeight + 2; showSub(el.menú, dir); } else { show(el.menu,dir); activeSub = nulo; } } función topPos(el) { var temp = el; var y = 0; while (temp.id!="menú") { temp = temp.offsetParent; y += temp.offsetTop; } devolver y; } función izquierdaPos(el) { var temp = el; var x = 0; while (temp.id!="menú") { temp = temp.offsetParent; x += temp.offsetLeft; } return x + el.offsetParent.offsetWidth; } función show(el, dir) { if (typeof(fade) == "función") fade(el, true); else if (typeof(swipe) == "función") { tempElSwipe = el; tempDirSwipe = dir; el.style.visibility = "visible"; el.style.visibility = "oculto"; ventana.setTimeout("tempSwipe()", 0); // deslizar(el, dir); } else el.style.visibility = "visible"; } var tempElSwipe, tempDirSwipe; función tempSwipe() { deslizar(tempElSwipe, tempDirSwipe); } función mostrarSub(el,dir) { mostrar(el,dir); // deslizar(el, dir); // desvanecerse(el, verdadero); // el.style.visibility = "visible"; } function cleanup(menu,hide) { if (menu.activeItem) { //Si has estado aquí antes if ((menu.activeItem.className == "sub") && (menu.activeItem.subMenu)){ / /El elemento activo tiene un submenú cleanup(menu.activeItem.subMenu, true); //Limpiar los subs también } menuItemNormal(menu.activeItem); } if (ocultar) { ocultarMenú(menú); } } función ocultarMenu(el) { if (typeof(fade) == "función") { fade(el, false); // ventana.setTimeout(fadeTimer); } else if (typeof(swipe) == "función") { hideSwipe(el); } else el.style.visibility = "oculto"; } función getChildren(el) { var tList = el.children.tags("TABLA"); devolver Listat[0]; } var dragObject = nulo; var dragObjectPos = "arriba"; var tx; variedad; ventana.onload=fixSize; window.onresize=fixTamaño; función fixSize() { if (dragObjectPos == "arriba") { externalDiv.style.top = menu.offsetHeight; externalDiv.style.height = document.body.clientHeight - menu.offsetHeight; } else if( dragObjectPos == "abajo") { externalDiv.style.top = 0; externalDiv.style.height = document.body.clientHeight - menu.offsetHeight; menu.style.top = document.body.clientHeight - menu.offsetHeight; } else { exteriorDiv.style.top = 0; exteriorDiv.style.height=document.body.clientHeight; } } función document.onmousedown() { if(window.event.srcElement.id == "manejar") { dragObject = document.all[window.event.srcElement.getAttribute("para"]; Restaurar(); //Ocultar los menús mientras se mueve ty = (window.event.clientY - dragObject.style.pixelTop); ventana.event.returnValue = falso; ventana.event.cancelBubble = verdadero; } más { dragObject = null; } } función document.onmouseup() { if(dragObject) { dragObject = null; } } function document.onmousemove() { if(dragObject) { if(window.event.clientX >= 0) { if((window.event.clientY - ty) <= 15) { dragObject.style.border = "0 botón sólido"; dragObject.style.width = "100%"; dragObject.style.top = 0; dragObject.style.left = 0; dragObjectPos = "arriba"; arreglarTamaño(); } else if ((window.event.clientY - ty) >= document.body.clientHeight - menu.offsetHeight - 15) { dragObject.style.border = "0 cara de botón sólida"; dragObject.style.width = "100%"; dragObject.style.top = document.body.clientHeight - menu.offsetHeight; dragObject.style.left = 0; dragObjectPos="abajo"; arreglarTamaño(); } más { dragObject.style.width = "10px"; dragObject.style.left = ventana.event.clientX; dragObject.style.top = ventana.event.clientY - ty; dragObject.style.border = "2px inicio blanco"; dragObjectPos = "flotante"; arreglarTamaño(); } } else { dragObject.style.border = ""; dragObject.style.left = "0"; dragObject.style.top = "0"; } ventana.event.returnValue = falso; ventana.event.cancelBubble = verdadero; } } función showWindowedObjects(mostrar) { if (hideWindowedControls) { var windowedObjectTags = new Array("SELECT", "IFRAME", "OBJECT", "APPLET", "EMBED"); var windowedObjects = nueva matriz(); varj=0; for (var i=0; i<windowedObjectTags.length; i++) { var tmpTags = document.all.tags(windowedObjectTags[i]); if (tmpTags.length > 0) { for (var k=0; k<tmpTags.length; k++) { windowedObjects[j++] = tmpTags[k]; } } } for (var i=0; i<windowedObjects.length; i++) { if (!show) windowedObjects[i].visBackup = (windowedObjects[i].style.visibility == null)? "visible" : windowedObjects[i].style.visibility; windowedObjects[i].style.visibility = (mostrar)? windowedObjects[i].visBackup: "oculto"; } } } </SCRIPT> <TABLE cellSpacing=1 id=menu onclick=menuClick() onmouseout=menuOut() onmouseover=menuOver() onselectstart="return false"> <TBODY> <TR id=menubar> <TD class= estilo discapacitado="PADDING-LEFT: 0px; PADDING-RIGHT: 1px"> <DIV class=disabled id=handle style="ALTURA: 100%; IZQUIERDA: 3px; ANCHO: 3px" title="¡Muéveme!" for="menú"></DIV></TD> <TD clase=root>HOME <TABLE cellSpacing=0 clase=menú estilo="VISIBILIDAD: oculto"> <TBODY> <TR href="javascript:alert('可以改成一个链接!')"> <TD></TD> <TD noWrap>LINK</TD> <TD></TD> </TR> <TR class=sub> <TD></TD> <TD noWrap>LINK</TD> <TD> <TABLE cellSpacing=0 class=menu style="VISIBILIDAD: oculto"> <TBODY> <TR href="javascript:alert('可以改成一个链接')"> <TD noWrap style="HEIGHT: 20px">ENLACE</TD> </TR> </TBODY> </TABLE> </TD> </TR> <TR class=disabled> <TD colSpan=3> <HR > </TD> </TR> <TR href="javascript:alert('可以改成一个链接')"> <TD></TD> <TD>LINK</TD> <TD></TD> </TR> <TR title="Esto es realmente fácil"> <TD></TD> <TD>LINK</TD> <TD></TD> </TR> </TBODY> </TABLE> < /TD> <TD class=root>Ayuda <TABLE cellSpacing=0 class=menu style="VISIBILIDAD: oculto"> <TBODY> <TR href="javascript:alert('www.downcodes.com')"> <TD >>TD> <TD>Acerca de</TD> <TD></TD></TR></TBODY></TABLE></TD> <TD class=disabled width="100%"> </ TD></TR></TBODY></TABLE> <DIV id=exteriorDiv>