0

Subir com Efeito jquery

Unknown

 Botão subir ao topo com Efeito jQuary e CSS3

1. Acesse o painel principal do seu blog e clique em "Modelo" -> "Editar HTML".
2. Aperte CTRL + F e procure por <body>
3.Abaixo dessa tag cole o seguinte código:
                                                           
<style>
#topopagina {
background: url("http://dl.dropbox.com/u/47734544/Icones/Subir%20ao%20topo%202.png") no-repeat TOP;
background-color: whitesmoke;
bottom: 5px;
width: 48px;
cursor: pointer;
border:1px solid #ccc;
text-decoration: none;
height:25px;
border-radius: 10px;
padding: 10px;
position: fixed;
right: 10px;
display:block;
-webkit-transition:All 0.5s ease;
-moz-transition:All 0.5s ease;
-o-transition:All 0.5s ease;
z-index: 99999999999;
}
#topopagina:hover {
height: 150px;
background-position: top;
-webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);
-moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);
-o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);
}
</style>
<a href='#' id='topopagina'></a>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
    $(function(){$.fn.scrollToTop=function(){$(this).hide().removeAttr(&quot;href&quot;);if($(window).scrollTop()!=&quot;0&quot;){$(this).fadeIn(&quot;slow&quot;)}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()==&quot;0&quot;){$(scrollDiv).fadeOut(&quot;slow&quot;)}else{$(scrollDiv).fadeIn(&quot;slow&quot;)}});$(this).click(function(){$(&quot;html, body&quot;).animate({scrollTop:0},&quot;slow&quot;)})}});
      $(function() {
                    $(&quot;#topopagina&quot;).scrollToTop();
                });
            </script>

Nenhum comentário:

Postar um comentário

Assinar: Postar comentários (Atom)
 

Todos os direitos reservados à Design Is Next © 2012 2013 - All Rights Reserved. | Desenvolvido por: Lawliet