Botón ir arriba en Blogger: Código y Tutorial

Mugiwara · 22 Feb 2014

Buenos días, alguien sabe un código para poner un botón para ir arriba en blogger? uno como el de este blog de pruebas ->Play ►

Encontré un tutorial en ciudad blogger , pero no funciona, si es que alguien sabe , se lo agradecería mucho
Ya tengo lista la imagen , solo falta el código.

Adrian Cavero · 22 Feb 2014

Prueba con este : Las nubes tapan el cielo.: Tutorial: Poner botÃ³n de ir arriba. :encouragement:

Marginal · 22 Feb 2014

Hay muchos scripts en san google no esta de mas buscar uno bueno

Enviado desde mi XT919 mediante Tapatalk

Mugiwara · 22 Feb 2014

Windowshq dijo:
Prueba con este : Las nubes tapan el cielo.: Tutorial: Poner botÃ³n de ir arriba. :encouragement:

Hola creo que hay un problema con ese tutorial, dice Copiar el código que aparece abajo. , pero no aparece ningún codigo

kanikase · 22 Feb 2014

uno simple:
<div style= 'position:fixed; bottom:5px; right:5px; z-index:9999;'><a href='#3><img src='tu_imagen.png'/></a></div>

puedes cambiar las posiciones, ahi estara abajo a la derecha, puedes cambiar bottom pot top y right por left

Gustavito · 22 Feb 2014

O algo mas simple

PHP:

<a href="#"><img src="irarriba.png" title="Ir arriba" style="position: fixed; bottom: 10px; right: 2%;" /></a>

irarriba.png Colocas el nombre de tu imagen tener en cuenta si es jpg png o gif

Saludos

Mugiwara · 22 Feb 2014

Gustavito dijo:
O algo mas simple

PHP:

<a href="#"><img src="irarriba.png" title="Ir arriba" style="position: fixed; bottom: 10px; right: 2%;" /></a>

irarriba.png Colocas el nombre de tu imagen tener en cuenta si es jpg png o gif

Saludos

Gracias Gustavito, este si funciono, solo que aparece todo el rato, sabes como hacerlo para q solo aparezca cuando bajen?

EnzoZ · 22 Feb 2014

Mugiwara dijo:
Gracias Gustavito, este si funciono, solo que aparece todo el rato, sabes como hacerlo para q solo aparezca cuando bajen?

Eso es en JQuery, busca en google un codigo en JQuery.

Gustavito · 22 Feb 2014

Bueno de todo lo que probe ese era el unico que me funciono... y si aparece todo el tiempo

Pero no pude hacer andar ningun otro, pero dbe de existir jeje

8:

Mugiwara · 22 Feb 2014

EnzoZ dijo:
Eso es en JQuery, busca en google un codigo en JQuery.

Gracias, puse buscar ir arriba jquery y me salio un buen tutorial

---------- Post agregado el 22-feb-2014 hora: 18:22 ----------

Gustavito dijo:
Bueno de todo lo que probe ese era el unico que me funciono... y si aparece todo el tiempo Pero no pude hacer andar ningun otro, pero dbe de existir jeje8:

Gustavito, encontré este : solo tienes que pegarlo antes de < /head>

<script>
$(window).scroll(function(){
if ($(this).scrollTop() > 500) {
$('.scrollUp').fadeIn();
} else {
$('.scrollUp').fadeOut();
}
});
$(document).ready(function(){
$('.scrollUp').click(function(){
$("html, body").animate({ scrollTop: 0 }, 600);
return false;
});
})
</script>

<a href="#" class="scrollUp"></a>

<style type="text/css">
.scrollUp{
/* Ancho de la imagen que usaremos como boton */
width:99px;
/* Altura de la imagen que usaremos como boton */
height:99px;
/* Grado de opacidad de la imagen que usaremos como boton */

position:fixed;
bottom:90px; /* conviene que quede arriba del footer */
left:30px; /* Izquierda o derecha según el diseño*/
display:none;
/* URL de la imagen que usaremos como boton */
background: url('http://1.bp.blogspot.com/-QZ0cmY8ejdc/Tdu5-UkizDI/AAAAAAAAAMM/xi1h810RGOk/s320/flecha-arriba.gif') no-repeat; /* nuestra imagen*/
}
</style>