La version 2 de warioteayuda

Menus-parte1

Herramientas para tu web ! menus para web master!

Parte I

Menu horizontal normal ::

Codigo :

<center><div style="position:absolute;left:780px;top:800px;"><br /> <table align="right" width="185" cellspacing="0" cellpadding="0" border="0"> <tbody> <tr class="checked_menu"> <td align="center" id="nav_Home" class="nav"><a class="menu" href="Url donde te llebara el link" _fcksavedurl="Url donde te llebara el link">Nombre del link</a></td> </tbody> </table> <br /> </b><b></div></center>

Codigo para modificar en codes sin style sin tags , tamaño posiocion por defecto:

td.nav { height: 33px; width: 160px; position:absolute;left:770px

Codigo para modificar tu menu a tu gusto :

<style type="text/css"> <!— <br /> td.nav_heading{background-image:url(Url de imagen del boton navegar);background-color:#NÚMERO DEL COLOR;} td.nav{background-image:url(Url de botoenes en general);} td.nav:hover{background-image: url(Al pasar el mouse);} <br /> td.edit_below_nav{visibility:hidden;} td.edit_rechts_sbg{visibility:hidden;} --></style>

Otro menu :

<div style="position: absolute; left: 635px; top: 20px;"> <form> <input type="button" onClick_fckprotectedatt_fckprotectedatt=" onClick_fckprotectedatt=" onClick="" top.location.href="this.form.list.options[this.form.list.selectedIndex].value""" value="TEXTO DEL BOTON" /><select name="list"> <option value="QUI EL URL DE PA PAGINA" selected="selected"> NOMBRE DEL URL </option> <option value="QUI EL URL DE PA PAGINA">NOMBRE DEL URL</option> <option value="QUI EL URL DE PA PAGINA">NOMBRE DEL URL</option> <option value="QUI EL URL DE PA PAGINA">NOMBRE DEL URL</option> <option value="QUI EL URL DE PA PAGINA">NOMBRE DEL URL</option> <option value="QUI EL URL DE PA PAGINA">NOMBRE DEL URL</option> <option value="QUI EL URL DE PA PAGINA">NOMBRE DEL URL</option> <option value="QUI EL URL DE PA PAGINA">NOMBRE DEL URL</option> </select> </form> </div>

Otro menu despegable al click se genera pop up

Fuente:

http://www.mazosoft.net/

<form name="deposito"> <p><u><select onchange_fckprotectedatt=" onchange="newwin=window.open(this.form.deposito.options[this.form.deposito.selectedIndex].value, 'JavaScript','scrollbars=1,resizable=0,width=640,height=480,left = 80,top = 30')"" size="7" class="tk" name="deposito"> <option value="menu2.htm">Menú categorías</option> <option value="menu.htm">Menú Microsoft</option> <option value="banners.htm">Rotar banners</option> <option value="buscador.htm">Buscador</option> <option value="popup.htm">Generar pop up</option> <option value="redireccionar.htm">Redireccionar</option> <option value="quitarframes.htm">Quitar frames</option> <option value="pluginflash.htm">Plugin Flash</option> <option value="codigofuente.htm">Código fuente</option> <option value="sintags.htm">Eliminar tags</option> <option value="reenvio.htm">Evitar re-envío</option> <option value="mensaje.htm">Mensaje animado</option> <option value="menuestatico.htm">Menú estático</option> <option value="fade.htm">Efecto imagen</option> <option value="popup2.htm">Ventana pop up</option> <option value="mover01.htm">Mover ventana</option> <option value="ventanafull.htm">Ventana full</option> <option value="scrollnoticias.htm">Scroll de noticias</option> <option value="caducar.htm">Caducar página</option> <option value="mouse.htm">Anular botones</option> <option value="prev1.htm">Pasar variables</option> <option value="buscarpalabra.htm">Buscar palabras</option> <option value="paginainicio.htm">Página de inicio</option> <option value="validar.htm">Validar formulario</option> <option value="subirarchivos.htm">Subir archivos</option> <option value="navegador.htm">Detectar browser</option> <option value="resoluciones.htm">Resoluciones</option> <option value="precarga.htm">Cargar imágenes</option> <option value="detenererror.htm">Detener error</option> <option value="favoritos.htm">Agregar favoritos</option> <option value="password.htm">Password</option> <option value="banners2.htm">Cambiar banners</option> <option value="cambiarimagen.htm">Imagen aleatoria</option> <option value="cursor.htm">Efectos cursor</option> <option value="fecha.htm">Fecha</option> <option value="maquinaescribir.htm">Máquina escribir</option> <option value="titulo1.htm">Título ventana 1</option> <option value="titulo2.htm">Título ventana 2</option> <option value="cuentapro.htm">Pasaron x días</option> <option value="barraestado.htm">Barra de estado</option> <option value="enviaremail.htm">Oulook Express</option> <option value="ascii.htm">Texto ASCII</option> <option value="codigo.htm">Probar código</option> </select></u></p> </form>

Fuente de este menu :

Fuente!

Menu vertical :

" Encima de pagina"
<style type="text/css"> /*Credits: Dynamic Drive CSS Library */ /*URL: http://www.dynamicdrive.com/style/ */ .animatedtabs{ border-bottom: 1px solid gray; overflow: hidden; width: 100%; font-size: 14px; /*font of menu text*/ } .animatedtabs ul{ list-style-type: none; margin: 0; margin-left: 10px; /*offset of first tab relative to page left edge*/ padding: 0; } .animatedtabs li{ float: left; margin: 0; padding: 0; } .animatedtabs a{ float: left; position: relative; top: 5px; /* 1) Number of pixels to protrude up for selected tab. Should equal (3) MINUS (2) below */ background: url(http://pixelea.com/s/4bb8ea4340.gif) no-repeat left top; margin: 0; margin-right: 3px; /*Spacing between each tab*/ padding: 0 0 0 9px; text-decoration: none; } .animatedtabs a span{ float: left; position: relative; display: block; background: url(http://pixelea.com/s/4bb8ea4340.gif) no-repeat right top; padding: 5px 14px 3px 5px; /* 2) Padding within each tab. The 3rd value, or 3px, should equal (1) MINUS (3) */ font-weight: bold; color: black; } /* Commented Backslash Hack hides rule from IE5-Mac */ .animatedtabs a span {float:none;} /* End IE5-Mac hack */ .animatedtabs .selected a{ background-position: 0 -125px; top: 0; } .animatedtabs .selected a span{ background-position: 100% -125px; color: black; padding-bottom: 8px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */ top: 0; } .animatedtabs a:hover{ background-position: 0% -125px; top: 0; } .animatedtabs a:hover span{ background-position: 100% -125px; padding-bottom: 8px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */ top: 0; } </style>

Para agregarlos:
<div class="animatedtabs"> <div style="position:absolute;left:6px;top:1300px;"> <ul> <li> <a href="LINK! " _fcksavedurl="LINK! " title="Home"><span>Menu </span></a></li> <li class="selected"> <a href="LINK! /" _fcksavedurl="LINK! /" title="CSS Examples"><span>Menu</span></a></li> <li> <a href="LINK! " _fcksavedurl="LINK! " title="New"><span>Menu</span></a></li> <li> <a href="LINK! " _fcksavedurl="LINK! " title="Revised"><span>Menu</span></a></li> <li> <a href="LINK! " _fcksavedurl="LINK! " title="Tools"><span>Menu</span></a></li> <li> <a href="LINK! " _fcksavedurl="LINK! " title="DHTML Forums"><span>Menu</span></a></li> </ul> </div>

Menu mac x !

No se puede mostrar la imagen “https://img.webme.com/pic/t/team-webmaster/menumac.jpg” porque contiene errores.

No se puede mostrar la imagen “https://img.webme.com/pic/t/team-webmaster/menumac.jpg” porque contiene errores.

Entra para conseguir el code!

Menu spin :

Fuente aqui!

Menu despespegable horizontal :

Click aqui para hacer estet tipo de menus !

Otro tipo de menu :

"Pegar encima de la pagina" :

Para agregar :

<div id="myjquerymenu" class="jquerycssmenu"> <ul> <li><a href="#" _fcksavedurl="#">Item 1</a></li>  <li><a href="#" _fcksavedurl="#">Item 2</a></li>   <li><a href="#" _fcksavedurl="#">Folder 1</a>   <ul>   <li><a href="#" _fcksavedurl="#">Sub Item 1.1</a></li>   <li><a href="#" _fcksavedurl="#">Sub Item 1.2</a></li>   <li><a href="#" _fcksavedurl="#">Sub Item 1.3</a></li>   <li><a href="#" _fcksavedurl="#">Sub Item 1.4</a></li>   </ul> </li>   <li><a href="#" _fcksavedurl="#">Item 3</a></li>   <li><a href="#" _fcksavedurl="#">Folder 2</a>   <ul>   <li><a href="#" _fcksavedurl="#">Sub Item 2.1</a></li>   <li><a href="#" _fcksavedurl="#">Folder 2.1</a>     <ul>     <li><a href="#" _fcksavedurl="#">Sub Item 2.1.1</a></li>     <li><a href="#" _fcksavedurl="#">Sub Item 2.1.2</a></li>     <li><a href="#" _fcksavedurl="#">Folder 3.1.1</a>       <ul>           <li><a href="#" _fcksavedurl="#">Sub Item 3.1.1.1</a></li>           <li><a href="#" _fcksavedurl="#">Sub Item 3.1.1.2</a></li>           <li><a href="#" _fcksavedurl="#">Sub Item 3.1.1.3</a></li>           <li><a href="#" _fcksavedurl="#">Sub Item 3.1.1.4</a></li>           <li><a href="#" _fcksavedurl="#">Sub Item 3.1.1.5</a></li>       </ul>     </li>     <li><a href="#" _fcksavedurl="#">Sub Item 2.1.4</a></li>     </ul>   </li>   </ul> </li>  <li><a href="#" _fcksavedurl="#">Item 4</a></li>  </ul> <br style="clear: left" /> </div>

fuente:

http://www.dynamicdrive.com/style/csslibrary