Botones para subir y bajar en Blogger

Botones para subir y bajar en Blogger

Hace no mucho, Dreko, el administrador de LockerzLatinos, me preguntó si lo podía ayudar a crear unos botones para subir y bajar en su blog, ahora lo publico en el blog, para los usuarios que lo necesiten en el suyo..

El resultado es el siguiente:


Los botones son solo referentes, el resultado son botones flotantes.
¿Cómo obtener estos botones en Blogger?

Primero, vamos a ''Diseño/Elementos de la página'' en donde agregaremos un Gadget:


Buscamos ''HTML/Javascript'':

En donde pegaremos el siguiente código:

<style type="text/css">.subir a:hover {background:none;}</style><div class="subir"><a style="display:scroll;position:fixed;bottom:60px;right:5px;" class="backtotop" href="#" rel="nofollow" title="Subir"><img style="border:0;" src="http://2.bp.blogspot.com/_qgZA1ny_dAs/S0QFsV1WD7I/AAAAAAAADhs/ZBKrnpzqBrk/s200/arrow8a.png"/></a></div>

<style type="text/css">.bajar a:hover {background:none;}</style><div class="bajar"><a style="display:scroll;position:fixed;bottom:5px;right:5px;" class="backtotop" href="#footer-wrapper" rel="nofollow" title="Bajar"><img style="border:0;" src="http://4.bp.blogspot.com/_qgZA1ny_dAs/S0QKJ3oGf7I/AAAAAAAADis/m4YOx1C9N2g/s320/arrow8b.png"/></a></div>

Guardamos los cambios y listo:


Notas:

  • Si deseas cambiar la ubicación de ambos botones, deberás cambiar:
right por left (para alinear a la izquierda)
bottom por top (Para subir los botones)
  • En el caso de sobremontarse los botones, o si están muy distantes uno del otro, aumenta o disminuye el valor de ''botom:60px''.
  • Si deseas cambiar las imágenes de los botones, reemplazas las URL por las correspondientes.
  • Si el botón ''Bajar'' no funciona, elimina el código ''-wrapper'' quedando sólo como ''#footer''.
Artículo aleatorio
BuySellAds
BuySellAds
BuySellAds
BuySellAds
BuySellAds
Artículos destacados
Marca de agua en las imágenes con CSS # - Marca de agua en las imágenes con CSS
Efecto de desenfoque con CSS # - Efecto de desenfoque con CSS
Botones para subir y bajar en Blogger # - Botones para subir y bajar en Blogger
Vídeotutorial: Crear plantilla para Blogger: Introducción a los códigos esenciales de Blogger # - Vídeotutorial: Crear plantilla para Blogger: Introducción a los códigos esenciales de Blogger
Insertar una página externa en una entrada en Blogger # - Insertar una página externa en una entrada en Blogger