Cómo crear botones interactivos rollover en Dreamweaver

Categories buscar, nuevo, segunda
0

Todo aquel que visite su sitio web se esperaría ver tus botones cambian cuando el ratón pasa sobre ellos. Rollovers indican que un botón se activa, y haciendo clic llevarán a los visitantes a otro sitio. Cuando se tome la referencia de HTML, usted descubre que usted no puede agregar rollovers, usted tiene que utilizar JavaScript o CSS. O puede utilizar Dreamweaver para escribir el código para usted.

Diseña tu barra de navegación o interfaz de la página web de su editor de imágenes favorito. Mantenga los elementos que no cambian en una sola capa. Mueva las capas con elementos que no cambian a una capa llamada Fixed y los elementos que va a cambiar con la reinversión en una segunda capa llamada Estado normal. Elementos de la interfaz Rollover podrían incluir el fondo, texto, barras de botones o efectos especiales aplicados a la capa.

Duplicar la capa fijo y el nombre Rollover. Realice los cambios que desea realizar para reflejar el nuevo estado de rollover. Ocultar la capa Rollover.

Seleccionar herramienta de corte web del editor de imágenes. Corte cada botón y el nombre con la paleta Opciones de sector del software (o herramientas). También debe ser capaz de agregar el enlace URL en el software de edición de imágenes. Si no, usted puede agregar en Dreamweaver.

Exporta la imagen como documento HTML con rodajas (es importante que la capa Rollover no sea visible en esta etapa). Compruebe el nuevo archivo HTML en un navegador para asegurarse de que todos los cortes son visibles. Cuando se conoce la obra original del archivo HTML, mostrar la capa Rollover y ocultar la capa Estado normal. Seleccione los sectores de botón único y exportarlos como sectores seleccionados sólo a una subcarpeta dentro de la carpeta de imágenes.

Abra el archivo HTML en Dreamweaver. Usted debe ver toda la imagen a montar en la ventana de documento. Seleccione la división botón para mostrar el límite de la celda de tabla.

Abra la paleta de Comportamientos. Haga clic en el icono + y seleccione Intercambiar imagen en el menú desplegable para abrir el diálogo Intercambiar imagen. Revise para asegurarse de que se selecciona con el botón derecho y selecciona la opción Carga previa de imágenes y restaurar imágenes de Ratón Out opciones. Haga clic en el botón Examinar para buscar la imagen rebanar guardó para el estado de rollover.

Vista previa de la página web en su navegador. Si todo funciona correctamente, puede guardar la página web y subirlo a tu servidor.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>