Todo el mundo está familiarizado con los efectos generales de navegación, como el uso de CSS para configurar, subrayar, color de fondo o desplazamiento del texto de navegación. En la publicación anterior, algunos internautas mencionaron el sitio web http://www.tonta.com.cn/ y descubrí que el efecto de navegación en su página de inicio es bueno. Aunque el flash no tiene un efecto muy deslumbrante, es relativamente bueno. Delicado y tiene muy buen aspecto.
No tengo nada que hacer e intento lograr el mismo efecto de navegación en dw. El efecto es el siguiente: http://vip.5d.cn/flood/daohang/1.htm .
Primero, analice la composición del efecto. Cuando pasa el mouse, el fondo cambia y la imagen pequeña gira. ¡De acuerdo! Considere usar imagen de intercambio (voltear imagen) + cambio de imagen de fondo (definición CSS) en dw, que debería poder lograr el efecto.
Prepara 4 imágenes gif:
La imagen de fondo cuando pasa el mouse (en FW, Nimate puede lograr fácilmente el efecto de degradado. La transparencia de esta imagen cambia gradualmente de 0% a 100%)
[img]/conimages/web/2003-06/bg0604.gif[/img]
La imagen de fondo cuando se mueve el mouse (la transparencia de esta imagen cambia gradualmente de 100% a 0%)
[img]/conimages/web/2003-06/b0604.gif[/img]
pequeña imagen dinámica
[img]/conimages/web/2003-06/20604.gif[/img]
Imagen fija pequeña (configure el formato de imagen en gif en fw y guárdela)
[img]/conimages/web/2003-06/2a0604.gif[/img]
1. El efecto de fondo se implementa usando CSS para definir dos clases:
.style1 {imagen de fondo: url(bg.gif)}
.style2 {imagen de fondo: url(b.gif)}
se usa para la imagen de fondo cuando el mouse pasa y cuando se retira. Luego agregue el siguiente código en la celda:
onmouseover="this.className=' estilo1'"
onmouseout="this.className='style2'"
puede lograr el efecto de que el degradado de fondo aparezca cuando pasa el mouse y desaparezca después de que se aleja.
2. El efecto de voltear imagen le permite insertar una pequeña imagen estática en una celda, usar un comportamiento para agregar un efecto de intercambio de imagen y configurarlo para que se voltee a una imagen pequeña dinámica después de que el mouse pase sobre ella.
Para lograr un efecto más cercano, debe aplicar el efecto de inversión de imagen a la celda y cortar el siguiente código en el código de imagen pequeña estática:
onMouseOver="MM_swapImage('Image2','','2.GIF', 1)"
onMouseOut="MM_swapImgRestore()"
se pega en la etiqueta td del código de la celda.
Puede lograr voltear la imagen cuando el mouse pasa sobre la celda, produciendo un efecto dinámico.
En este punto se pueden lograr todos los efectos.
En este ejemplo, el efecto logrado con dw es casi comparable al efecto producido por el flash, o incluso mejor (logramos el efecto de que el degradado del fondo desaparezca cuando el mouse dibuja la celda).
Sección:
1. Hacer con cuidado imágenes de fondo degradado en fw (acabo de hacer dos imágenes de degradado aleatorias) + modificar las celdas de navegación puede hacer que el efecto sea más delicado y sobresaliente;
2. Al utilizar este método para crear efectos de navegación, debe utilizar varias celdas. Tenga en cuenta que el efecto de intercambio no se puede copiar. Después de copiar el código, debe modificar dos códigos:
onMouseOver="MM_swapImage('Image3','','. 2.GIF',1)"
<img src="2a.gif" name="Image3" width="15" height="15" border="0" id="Image3">
Simplemente modifique el nombre de la imagen volteada a un valor diferente.
3. El contenido técnico de este ejemplo no es muy alto; y no estoy muy familiarizado con flash, así que no sé cuál es más fácil de usar, dw o flash, pero solo lo menciono aquí para brindarles una manera de resolver el problema.
4. La superposición de dos efectos simples puede crear un efecto más genial. Espero que pueda ser esclarecedor para todos. Un punto más: al crear imágenes de fondo animadas, para lograr el efecto, debes configurar el bucle de la animación gif en cero. bucle (sin bucle)
:)