Estrella de Navidad

Seguimos con cosillas para adornar el blog en estas fechas navideñas, pero antes de nada os recomiendo que no pretendáis poner todos estos adornos navideños a la vez, pues el funcionamiento del blog podría verse afectado.

Feliz Navidad

Esta Estrella de Navidad se pasea a lo ancho de nuestra pantalla de derecha a izquierda, saludando con la mano y deseando a nuestras vistas Feliz Navidad, una vez que desaparece por el lado izquierdo de la pantalla  vuelve a salir desde el derecho y así sucesivamente.


Código:

Lo colocaremos en un gadget html en cualquier parte de la plantilla, por ejemplo en el footer.
<marquee  direction="left" style="position: absolute; left: 0px; top: 100px; height: 70px;" scrollamount="3"><img src="http://img99.imageshack.us/img99/6566/xestelnadal2hl1.gif"/><span style="color: #FFB800; font-size: 20px; font-weight: bold;">Feliz Navidad</span></marquee>
Modificaciones:
  • Podemos usar cualquier imagen que nos guste, cambiando la url de la estrella por la de la imagen que vayamos a utilizar.
  •  direction="left" Si queremos que la estrella comience su paseo por la derecha en lugar de salir desde la parte izquierda, cambiamos "left" por "right".
  • top: 100px; Es la distancia desde la estrella a la parte superior de la pantalla, según queramos que se vea más arriba o más abajo, cambiamos ahí el valor 100 por el que necesitemos.
  • height: 70px; Aquí pondremos el alto que tiene nuestra imagen e incluso algo más, para que esta no se vea cortada.
  • scrollamount="3" La velocidad de desplazamiento, a mayor número más velocidad.
  Esta línea es la que controla el aspecto del texto que sigue a la estrella:

<span style="color: #FFB800; font-size: 20px; font-weight: bold;">Feliz Navidad</span>

Aquí podemos cambiar el color del texto y el tamaño. Si no queremos mostrar ningun mensaje siguiendo a la imagen, sencillamente borramos esa línea.

0 comentarios:

Publicar un comentario