| |
El muy buscado Menú desplegable |
|
|
| |
Se trata del menú en el que aparecen y desparecen los submenus, y que se
puede encontrar ya en muchos sitios.
Por las preguntas de los foros parece ser la "bestia negra" del trabajo
con capas, sobre todo para los que empiezan. Aviso: Este tutorial pesa 650kb,
por lo que ten paciencia al cargarlo (dura casi 9 minutos), pero creo que vale
la pena (gracias a projectseven por la idea). Utilizaremos 4 capas:
- general: que será la que contenga los botones principales.
- menu1: será el desplegable del boton del primer menú
- menu2: será el desplegable del segundo botón
- cierre: será la capa encargada de cerrar los desplegables
(pulsa aquí para ver la demo).
Vamos a ir adelantando algo: El orden de visibilidad de las capas (el llamado
z-index) debe ser el orden en el que las he puesto arriba:la capa superior será
"general" y la inferior será "cierre"; por el medio se encontrarán las capas "menu1"
y "menu2". En el tutorial lo veréis con más detalle.También utilizaremos 5 archivos
de imágenes:
- butmenu1: es el nombre de la imagen que representa el boton del menú 1.
Se compone de 2 archivos, uno para cada estado:

- butmenu2: es el nombre para los archivos del menu2:

- shim.gif: es un gif transparente
OJO: no confundir el nombre de la imagen con el nombre del archivo: las
imágenes pueden tener nombre (aunque no suele ser muy habitual ponérselo).
Pueden ser útiles cuando queremos acceder a ellas desde un script, por ejemplo.En
este caso vamos a darles nombre para distinguirlas mejor cuando empecemos a aplicar
comportamientos... y veremos dónde hay que escribir el nombre.
Fe de Erratas:
En el tutorial veréis que a veces llamo botmenu1 ó botmenu2 a butmenu1 y 2 respectivamente.
Es fallo mío: se refieren a lo mismo (me dí cuenta cuando terminé de compilarlo,
lo siento)
LINKS
Este tutorial está basado en el de projectseven. Es muy recomendable
visitarlo porque, aparte de mostrar de una forma más completa lo que aquí se ve,
tiene una segunda parte muy interesante: que el contenido de los menús sea
recogido de una base de datos utilizando Ultradev!!!Y ahora, el tutorial
|
 |
¿Comentarios?
132,
de momento. Mostrando
36 ->40 |
36.- esta pagina esta chida est a de pèlos. |
 |
37.- ESO ES UNA COMPLETA BASURA
MEJOR VAYAN A COJER CAFE POR QUE DE DISEÑO WEB NO SABEN NADA |
 |
38.- PERO QUE BASURA DE MENU!!!
Por lo menos, lo hubieran hecho sin usar esa basura de dreamwaver... cochino programa |
 |
39.- que cagada de tutorial mandan un ejemplito mas cagon antes de hacer algo piencenlo y no nos hagan perder el tiempo en cagadas como esta
|
 |
40.- cero ke deberian escribir los pasos desde el principio ya ke estab muy avanzado |
 |
|
|