2/3/13

[Tutorial]Boton up que desvanece y aparece


Hola que tal chicas y mmmm no se si hay chicos pero bueno si estais ahi manifestaos que no muerdo bien este tuto lo hago porque me lo ha pedido aura-chan me di cuenta ahora de que me lo pidio seguro que lleva tiempo ese coment y yo sin enterarme bien aqui esta el tuto

1.PASO
Ve ha Plantilla>Edicion HTLM>Buscas </head> con Ctrl+f
2.PASO
Pega antes de <head> este código
 <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script>
y guarda la plantilla antes viendo si no paso nada

3.PASO
Otra vez a planilla tal y cual y buscas </body>
4.PASO
Pegas el siguiente código
<div id='IrArriba'>
<a href='#Arriba'><span/></a>
</div>
<script type='text/javascript'>
//<![CDATA[
// Botón para Ir Arriba
jQuery.noConflict();
jQuery(document).ready(function() {
jQuery("#IrArriba").hide();
jQuery(function () {
jQuery(window).scroll(function () {
if (jQuery(this).scrollTop() > 200) {
jQuery('#IrArriba').fadeIn();
} else {
jQuery('#IrArriba').fadeOut();
}
});
jQuery('#IrArriba a').click(function () {
jQuery('body,html').animate({
scrollTop: 0
}, 800);
return false;
});
});
});
//]]>
</script>
Dale a guardar y antes vista previa para que nada vaya mal

5.PASO
Buscmos ]]></b:skin>
Y pega el codigo

/* Botón Ir Arriba
----------------------------------------------- */
#IrArriba {
position: fixed;
bottom: 250px; /* Distancia desde abajo */
right: 5px; /* Distancia desde la derecha */
}
#IrArriba span {
width: 60px; /* Ancho del botón */
height: 60px; /* Alto del botón */

display: block;
background: url(Url de tu botón) no-repeat center center;

Lo que esta eb naranja es el ancho y el alto de la caga donde va el boton 
y lo de azul se supone
C R E D I T O S

9 comentarios:

  1. Lindo tuto! kumy lo siento si no comento tu blog :C
    lo que pasa es que No puedo comentarlo con Google Chrome.. trato de escribir en la caja de comentarios como lo estoy haciendo ahorita y no funciona y se me traba el navegador.. ahorita te estoy comentando desde Firefox porque nunca comento tu blog y pues se me hace algo cruel... asi que haré lo posible por comentar tu blog, y muchas felicidades atrasadas por haber llegado a tus 100 seguidores ^^ nyaa!!!

    ResponderEliminar
    Respuestas
    1. muchas gracias no te preocupes te comprendo es dificil comentar todos los blogs no te preocupes tu tranki ok

      Eliminar
  2. Hola kumy, m,ira yo cada vez que busco el codigo de body no me aparece y no entiendo porque :( :( :( busco respuestas

    ResponderEliminar
    Respuestas
    1. pues no se porque pasa eso porque esa plantilla la tengo yo vamos que use la misma plantilla para hacer los templetes la de picture windows mmm no se que puede pasar pusiste
      body
      todo completo?

      Eliminar
    2. Hola Kumy♥ Pues a Mi Me Paso lo Mismo :( n_n

      Eliminar
  3. No encuentro la parte script nose que cosa

    ResponderEliminar

Holaa!! muy buenos días-tardes-noches espero que te haya gustado la entrada & si me dejas una huellita estaría muy agradecida.
Si tienes alguna duda no te olvides de mandarme un mail a mi correo o bien hacerlo por medio de la sección de dudas
candelaaisiska@gmai.com