Crear un menu estilo pestañas

[juaco14]

Como crear un menu como este MENU en DreamWeaver 8.
Gracias!

[hades87]

http://araudi.net/ejemplos/menus_desplegables_CSS.html

[juaco14]

Gracias pero no esos menues desplegables, sino los del ejemplo que puse.

[hades87]

Pues sinceramente no se a que menú te refieres

[juaco14]

Aqui - http://forums.creativecow.net/

[hades87]

Y no puedes poner una imagen o algo, es que realmente nos e a que te refieres

[juaco14]

Ese menu

[jomaruro]

Hola:

En la página de Mikmoro, www.araudi.net tienes tres ejemplos de navegación por pestañas, a ver si te sirve alguno de ellos.

Saludos.

[kseso?]

Hola Juaco14
Sólo es cuestión de ver su código (con firefox + firebug es reálmente sencillo)

Tomemos un elemento cualquiera del menú, su código en el html es:

Código html:

<td onclick="document.location='http://reels.creativecow.net/'" onmouseout="this.className='nav';" onmouseover="this.className='navover';" class="nav"><a style="color: rgb(0, 0, 0);" href="http://reels.creativecow.net/">REELS</a></td>
 

Dejamos para otro momento el que usa tablas y eventos (y lo sencillo que sería con con css)

en mouseout aplica la clase ".nav" donde tiene definido el fondo naranja

Código css:

.nav {
background-image:url(http://wwwi.creativecow.com/docs/wrapper/images/bg_n_a.gif);
background-position:right center;
background-repeat:repeat-x;
}
 

y el cambio del fondo de naranja a blanco lo realiza con "onmouseover" aplicando la clase ".navover":

Código css:

.navover {
background-image:url(http://wwwi.creativecow.com/docs/wrapper/images/bg_no.gif);
background-repeat:repeat-x;
color:#513F1D;
}
 

Simple pero con sus peligros. Como te decía: una lista y sus elementos
<u><li><a....>..</a></li></ul>
y en vez de eventos directamente el css sobre "a" y "a:hover"

Un saludo.

P.D.: la información anterior es facilitada con un único fin: Educativo. Esto es, explicar y ejemplificar las distintas formas de hacer un menú y su funcionamiento. Recuerda que esa página y sus contenidos está bajo: © CreativeCOW.net All rights are reserved.