Página Principal Menú Charkleons Radio Online Facebook - Charkleons.com YouTube - Charkleons.com Twitter - Charkleons.com

Imagen flotante en Blogger

Imagen flotante en Blogger - Charkleons.com
Para colocar una imagen flotante en Blogger que por lo general está fija en alguna de las esquinas de la página, debemos agregarle simplemente un style al código de una imagen en HTML. A esta imagen flotante se le pueden dar muchos usos, ya depende de cada quien qué fin darle.

El código se coloca en un gadget HTML-Javascript, este puede estar ubicado en cualquier parte de la plantilla, ya que la ubicación de la imagen se la daremos con el código del style.


<a style="display:scroll;position:fixed;bottom:0px;right:0px;" href="URL que redirecciona"/><img src="URL de la imagen"/></a>

Ahora les voy a explicar las partes que podemos modificar del código:

Si queremos que la imagen esté en la parte inferior de la página, dejamos: bottom
Si queremos que la imagen esté en la parte superior de la página, dejamos: top

Si queremos darle una distancia ya sea desde la parte inferior o superior, reemplazamos 0px; por el valor que creamos necesario, ej: 50px; o 100px;  o lo dejan sin distancia, eso ya es al gusto de cada quien.

Si queremos que la imagen esté ubicada en la parte derecha de la página, dejamos: right
Si queremos que la imagen esté ubicada en la parte izquierda de la página, dejamos: left

Si queremos darle una distancia ya sea desde la parte derecha o izquierda, reemplazamos 0px; por el valor que creamos necesario, ej: 50px; o 100px;  o lo dejan sin distancia, eso ya es al gusto de cada quien.

Si no queremos que la imagen redireccione al hacer clic sobre ella, retiramos lo siguiente:

href="URL que redirecciona"

Si queremos usar la imagen como una flecha que lleve a la parte superior de la página, dejamos lo siguiente:

href="#"

Espero que esta información les sea muy útil.

Gracias.

2 comentarios:

Gracias por comentar.