Antes de Photoshop CS3 , los diseñadores web crear botones rollover usando Photoshop e Image Ready, que fueron empaquetados juntos anteriormente . Adobe dejó de utilizar Image Ready cuando compró Macromedia Dreamweaver , suponiendo que los diseñadores web pueden utilizar este programa especializado con Photoshop para crear sus transferencias. Usted crea los botones rollover en Photoshop de la misma manera . A continuación , puede utilizar Dreamweaver, otros editores web o un editor de texto para crear el código de vuelco. Aprenda a crear botones rollover en Photoshop CS3. Cosas que necesitará editor Web
Mostrar más instrucciones
1
Abra un nuevo documento que es el tamaño adecuado para los botones. Esto puede ser el tamaño de la página web o el tamaño de la bandera botón . Haga clic en "Archivo > Nuevo" e introduzca el tamaño en los cuadros correspondientes .
2
Crear el primer botón tal y como aparecerá cuando no se selecciona . Seleccione la herramienta de forma correcta en la " paleta de herramientas " y dibujar el botón . A continuación, seleccione la función " Tipo" y escriba el texto en el botón.
3
aplicar los efectos deseados en el botón o texto. Adobe ha proporcionado varias formas de aplicar los efectos. Para aplicar sus propios efectos personalizados , seleccione la capa en la paleta de " capa" . A continuación, seleccione el efecto deseado en el cuadro desplegable "FX " que se encuentra en la parte inferior de la " capa" palette.Photoshop CS3 ofrece estilos web predefinidos diseñados específicamente para botones. Si la paleta " Estilos " no está visible, seleccione "Windows > Estilos ". En el menú desplegable " Estilos " , seleccione " Estilos Web . " Asegúrese de que está seleccionada la capa del botón y seleccione la capa que desee de la paleta de " Estilos " .
4
Crear los botones restantes. Mantenga pulsada la tecla "Control" para seleccionar el texto y el botón . Haga clic dentro de la paleta de "Capa " y seleccione " Duplicar capa ". Mueva las capas copiado en la ubicación del botón siguiente. Cambie el texto para el nombre del nuevo botón. Repita este paso para crear todos los botones.
5
Cortar los botones. Seleccione la herramienta " Slice" y dibuje un cuadro alrededor de cada botón. Haga doble clic en cada botón para añadir opciones de sector . Asegúrese de que está seleccionada la "Imagen " en el "Tipo Slice" cuadro desplegable. Introduzca un nombre que describa el botón de apagado , como " [Botón ] _off . " Introduzca cualquier información relacionada con el sitio web de las cajas restantes.
6
Seleccione "Archivo > Guardar para web ... " Presione el botón "Guardar " . En la opción "Guardar optimizada como " cuadro de diálogo , seleccione la ubicación de las imágenes. Cree una nueva carpeta llamada "Off ". Si ha introducido la información de la página web , cambie el "Formato" para "HTML e imágenes. " Haga clic en " Aceptar".
7
Seleccione "Windows > Capa Comp . " Crear una nueva composición de capas , seleccione el botón " Crear nueva capa Comp " . Nombra algo que describe el actual conjunto de botones como "Off ".
8
Editar los botones para usar el estado de rollover . Aplicar los estilos, los colores o efectos a los botones actuales. Cree otra composición de capas y el nombre " On". Repita el paso 7 para guardar los botones en una nueva carpeta llamada " On". Abra la carpeta que contiene los botones y cambiar su nombre para reflejar el estado "on".
9
Crear el código de vuelco en un editor web. Utilice Dreamweaver , otro editor web o un editor de texto para crear el código de vuelco. Aquí está el código JavaScript para el botón de inicio en este tutorial : < img alt =" " name = " home_off home_off " src =" images /" width = " off /home_off.jpg 130 " height =" " class =" 47 style9 " border = " 0 " /> < /a >