martes, 3 de mayo de 2011

Imagenes en movimiento marquesina

Este es un truco sencillo con el que "animarás" una imagen con el efecto marquesina en distintas direcciones.
Os pongo la lista:
  • Marquesina normal
  • Marquesina hacia arriba
  • Marquesina hacia abajo
  • Marquesina con stop
Os voy a explicar cómo hacerlo (recuerda cambiar sólo lo que está en rojo):

Marquesina normal:
El código es este:
<marquee><center><img src="URL de la imagen" /></center></marquee>
Y quedaría así:



Marquesina hacia arriba:
<marquee direction="up"><center><img src="URL de la imagen" /></center></marquee>

Marquesina hacia abajo:
<marquee direction="down"><center><img src="URL de la imagen" /></center></marquee>



Marquesina con stop:
No tiene misterio, es simplemente una marquesina que al pasarle el mouse por encima, pausa la imagen.
<marquee onmouseover="stop()" onmouseout="start()" scrollamount="2" scrolldelay="100" direction="up"><center><img src="URL de la imagen" /></center></marquee>


Para añadir más imagenes a la marquesina:
<marquee scrolldelay="100" direction="up" crollamount="8" height="100px"> <center><br><img src="URL de la imagen" /><br><img src="URL de la imagen" /><br><img src="URL de la imagen" /></center> </marquee>




Recuerda:
Donde pone "up" es la dirección, "8" es la velocidad, "100px" es la altura.

2 comentarios: