Divisor

Éste sitio web usa cookies, puedes ver la política de cookies, Aquí. ⤵ ⤵


Enlaces e Imágenes en movimiento






El truco del que voy a escribir hoy, es para colocar imágenes, logos, banners, o links en movimiento tipo marquesina, y hará que el link o la imagen se detenga al pasar el cursor por encima, lo haremos de dos formas diferentes, una para las imágenes y otra para los enlaces que insertes en dicha caja tipo marquesina. Ahora, los codes.




Para los links con imágenes, éste es el código:



<marquee direction="up" style="text-align: center; width:200px;height:150px;border:1px solid #ccc;padding:3px" scrollamount="1" onMouseOver="this.stop()" onMouseOut="this.start()">
<a href="URL del enlace 1"><img src="URL de la imagen 1"/></a><br/>
<a href="URL del enlace 2"><img src="URL de la imagen 2"/></a><br/>
<a href="URL del enlace 3"><img src="URL de la imagen 3"/></a>
</marquee>



Y para los enlaces o links con texto, éste es el código:



<marquee direction="up" style="text-align: center; width:200px;height:150px;border:1px solid #ccc;padding:3px" onMouseOver="this.stop()" onMouseOut="this.start()" scrollamount="1" >
<a href="URL del enlace 1">Nombre del enlace 1</a><br/>
<a href="URL del enlace 2">Nombre del enlace 2</a><br/>
<a href="URL del enlace 3">Nombre del enlace 3</a>
</marquee>



Ahora sólo basta con hacer unas modificaciones:


  • Debes cambiar los datos resaltados en los dos códigos mostrados.
  • marquee direction="up"es la dirección a donde se mueve, up arriba, down abajo, right derecha, left: qué es izquierda. Son movimientos.
  • width:200px;height:150px; es el tamaño del cuadro.
  • border:1px solid #ccc; es el ancho del borde y el color del borde.
  • scrollamount="1" es la velocidad con la que se mueven los links, números más altos dará mayor velocidad. Ejemplos de los dos códigos abajo:







Blog recopilador de tecnología y recursos



Aizum Blog, viernes, septiembre 14, 2012


Divisor Star

✏ Buscador!

En las redes ⤵

✏ Vídeos!

 

Publicidad!

Subir hacia arriba ▲ Modificated & Designed by Iván Dangerfield © 2014. Converted by Bloggertheme9