crear álbum de fotos

Comportamientos en Dreamweaver

Profesor: Samuel Molina Javier Página 1

Crear álbum de fotos

I. Crear carpeta raíz “Album”

II. Crear sitio web “album1”

III. Crear un nuevo documento HTML e insertar tabla:

Fila: 1

Columnas: 2

Ancho de tabla: 955

Grosor del borde: 0



IV. Cambiar propiedades de tabla

Alineación de tabla: centro

Cambiar alineación de la 1ra celda: horizontal – centro y vertical – superior

Cambiar alineación de la 1ra celda: horizontal – centro y vertical – medio

V. Insertar las imágenes en la 1ra celda

Tamaño de cada imagen: 250 x 150

Asignar nombre a cada imagen ejemplo. Img1



VI. Ahora insertar imagen otra imagen en 2da celda:

Tamaño de imagen: 670 x 490

Nombre de imagen: contenedor

VII. Ahora activamos el panel de comportamientos



VIII. Seleccionar img1

IX. Seleccionamos tipo de comportamiento

Clic en signo + del panel comportamientos

Clic en Intercambiar imagen



X. En ventana intercambiar imagen

Seleccionar Imagen “contenedor” del cuadro imágenes

Y luego hacer clic Examinar

Seleccionar img1 e insertar

XI. Desactivar la opción Restaurar imágenes OnMouseOut y clic en aceptar.

Ahora seleccione img2 y ejecute los mismos procedimientos que realizaste con img1

Una vez terminada guar la página con nombre mi_album1



XII. Para ver el resultado presiona F12 y veraz que al pasar el cursos por encima de cada imagen

cambiará de tamaño en imagen contenedor.

XIII. Agregando más efectos de comportamiento a nuestro álbum.

Seleccione la img1

Y veraz en el panel comportamientos onMouseOver

Cambiamos a evento onClick

También cambiamos color de relleno de tabla anegro



Al presionar F12 veras que ahora al pasar el curso sobre img1 no cambia sino recién al hacer click

XIV. Realiza el mismo cambio para cada imagen



XV. Agregar efecto desvanecer y aparecer

Seleccione img1

Click en signo + del panel comportamientos

Click en efectos

Click en aparecer/Desvanecer

En ventana aparecer/Desvanecer

Seleccione img “contenedor” del elemento de destino

En efecto: aparecer



XVI. Ahora seleccione realiza el mismo procedimiento para cada imagen y veras el resultado final

es muy interesante.

crear álbum de fotos

Documents