1. En una página normal de Dreamweaver Insertamos una capa. Como yo tengo Dreamweaver CS3 nos vamos a Insertar > Objetos de diseño > Div PA (Capa)
2. Para hacer más vistoso este menú, agregamos un botón flash en la capa. Por supuesto para hacer esto tendrás que guardar la página web antes.
3. Podemos ajustar la capa con el botón. Ahora agregamos otra capa, y la alineamos con la capa 1.
4. Voy a insertar 3 botones flash en esta capa para hacer el Menú, y los voy ajustar a la capa. Recuerden que esto es opcional porque podríamos hacerlo con texto.
5. Bien, Ahora nos vamos a los comportamientos desde Ventana > Comportamientos o con Shift + F4
6. Ahora viene lo interesante, fíjate bien. Selecciona la primera capa (capa 1), y agregas un comportamiento presionando el signo +
y seleccionamos la opción de Mostrar – Ocultar elementos .
Si esta opcion no aparece vete en el mismo menú de comportamientos y seleccionas Mostrar eventos para y seleccionas IE 6.0
7. Recuerda que tienes presionada la capa 1, entonces aquí en la opción elementos selecciona la capa 2 y haces clic en Mostrar (Show) y damos Aceptar (OK).
8. En los comportamientos en la parte de eventos ahora seleccionamos la opción de onMouseOver
9. Teniendo presionada la capa 1 agregamos un comportamiento mas (signo +), volvemos a seleccionar la opción de Mostrar – Ocultar elementos (Show – Hide Elements) , en la opción de Elementos seleccionamos la capa 2 y presionamos ocultar
10. En los eventos le agregamos el de onMouseOut
11. Si quieres puedes probar ahorita el funcionamiento de la pagina con F12 aunque todavía falta un poco más. Tal vez tengas que activar los botones para que funcionen porque estos son botones flash.
12. Vas bien hasta ahora, sino, es todavía momento de que corrijas algo. Bueno ahora selecciona la capa 2. Selecciona los comportamientos (signo +), vuelves a seleccionar la opción de Mostrar – Ocultar Elementos (Show – Hide Elements) y en Elementos selecciona de nuevo la capa 2 y das clic en Mostrar (Show) y luego Aceptar (OK). (Prácticamente tendrías que hacer de nuevo los pasos 6 al 10, pero no te preocupes que seguiré explicando paso a paso)
13. En los eventos ahora selecciona el de onMouseOver
14. Teniendo la capa 2 seleccionada vuelves a sacar los comportamientos (+)
15. Opción Show – Hide Elements
16. En opción Elemento seleccionamos capa 2 y clic en Hide (ocultar) y luego OK
17. En los eventos escoges onMouseOut
18. Y por fin llega el momento de probar la página con F12.
Te sorprende lo fácil que es. Bueno si al principio te aparece todo el menú es porque falta una opción más que tienes que investigar para que te aparezca perfecto el menú. Pista presiona F2.
Si no logras encontrar la opción escríbeme a mi correo
jdflortis@gmail.com o déjame un comentario.
Que te pareció el mini tutorial, déjame un comentario por cualquier duda, consulta o sugerencia. Agradecer no cuesta nada. Y de nuevo gracias Narváez.
