Cómo hacer un rollover con Dreamweaver

dreamweaver
Crear un album de fotos con DreamWeaver
25 diciembre, 2014
dreamweaver
Uso del refresh en DreamWeaver
25 diciembre, 2014

Cómo hacer un rollover con Dreamweaver

dreamweaver

Cómo hacer un rollover con Dreamweaver

Antes de empezar debes tener dos imágenes (pueden ser JPEG o GIF) para este ejercicio. Una será la imagen original y la otra la imagen del “rollover”.

original rollover
Fig. 1

Dentro de Dreamweaver (3, 4 ó MX), vamos al área de menú principal hasta encontrar la palabra INSERT. Dentro de INSERT nos movemos a INTERACTIVE IMAGES y ahí escogemos ROLLOVER IMAGE.

Rollover
Fig. 2

  1. Comenzaremos asignándole un nombre a nuestro “rollover”. De esta manera nuestro documento estará mas organizado.
  2. En el área de ORIGINAL IMAGE va la imagen inicial del “rollover”. Esta es la imagen que se mostrará cuando no este el cursor del mouse o ratón sobre ella.
  3. En ROLLOVER IMAGE va la imagen que cambiará cuando el curso se coloque sobre la imagen.
  4. Para terminar verificamos que este marcado donde dice PRELOAD ROLLOVER IMAGE.

Rollover

Opcional. También tienes la opción de añadirle un texto alterno al “rollover”, este se activa cuando el cursor se mantiene varios segundos sobre la imagen. Y además de una dirección web para cuando el usuario de click sobre la imagen.

Rollover
Ejemplo del “rollover”

menu 1 menu 2 menu 3 menu 4 menu 5

Ejemplo de un menú usando “rollovers”.

Autor: Jaime Olmo
http://www.ecodig.com/dreamweaver/dw001.htm

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *