La creación de una imagen de sustitución en dreamweaver cs3

En Dreamweaver, imágenes de sustitución - como su nombre lo indica - están diseñados para reaccionar cuando alguien saca un cursor sobre una imagen. El efecto puede ser tan dramático como una imagen de un perro siendo reemplazada por una imagen de un león, o tan sutil como el color de una palabra cambia como una imagen sustituye a otra. De cualquier manera, Dreamweaver incluye un cuadro de diálogo especial para los vuelcos que permite crear un simple efecto de vuelco uno de los comportamientos más fácil de aplicar.

Para crear una imagen de sustitución mediante el cuadro de diálogo Insertar imagen de sustitución de Dreamweaver, siga estos pasos:

1. Haga clic para colocar el cursor en la página donde desea que aparezca el vuelco del vehículo.

efectos de conversión requieren al menos dos imágenes: una para el estado inicial y otro para el estado de rollover. Se pueden utilizar dos imágenes diferentes o dos otros similares, pero ambos deben tener las mismas dimensiones. De lo contrario, se obtiene algunos efectos de escala extraño porque ambas imágenes deben mostrarse en exactamente el mismo espacio en la página.

2. Elija Insertar -gt; Objetos de imagen -gt; Imagen de sustitución.

Aparece el cuadro de diálogo Insertar imagen de sustitución.

3. En el cuadro Nombre de imagen, el nombre de su imagen.

Antes de poder aplicar un comportamiento a un elemento, como una imagen, el elemento debe tener un nombre para que el script comportamiento se puede hacer referencia a ella. Se puede nombrar a los elementos lo que quiera, siempre y cuando no utilice espacios o caracteres especiales.

4. En el cuadro de imagen original, especifique la primera imagen que desea visible. Utilice el botón Examinar para buscar y seleccionar la imagen.

Si las imágenes no están ya en la carpeta raíz de su sitio, Dreamweaver copiarlos en su sitio cuando se crea el vuelco del vehículo.

5. En el cuadro Imagen de sustitución, introduzca la imagen que quiere llegar a ser visible cuando los visitantes se mueven sus cursores sobre la primera imagen.

Video: Dreamweaver CS6 Imagen Sustitución 2

Una vez más, puede utilizar el botón Examinar para buscar y seleccionar la imagen.

6. Seleccione la casilla de verificación Carga previa de imagen por encima para cargar todas las imágenes de sustitución en la caché del navegador cuando la página se carga por primera.

Si no elige hacer este paso, los usuarios pueden experimentar un retraso debido a que la segunda imagen no se descargará hasta que un ratón es movido sobre la imagen original.

7. En el Al hacerse clic, ir a la caja URL, introduzca cualquier dirección web o en Examinar para buscar otra página en su sitio que desea establecer el vínculo.

Video: 06. Curso Básico de Html. Imagen de sustitución. Menú. Propiedades imagen. Vínculos en Botones

Si no se especifica una dirección URL, Dreamweaver inserta automáticamente el signo # como un marcador de posición.

8. Haga clic en OK.

Video: g5 Uso de imágenes de sustitución en Dreamweaver CC 2017

Las imágenes se configuran automáticamente como un vuelco.

9. Haga clic en el icono del globo en la parte superior del espacio de trabajo para previsualizar su trabajo en un navegador y probar cómo funciona el vuelco del vehículo.

Artículos Relacionados