Botão Voltar ao topo

Views:
CÓDIGO DA FONTE ESPECIAL:
(cole abaixo de <head> caso não a tenha em seu template)

<script src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js'/>
<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet'/>

CÓDIGO CSS:

/* VOLTAR AO TOPO BY ELAINEGASPARETO.COM*/
#backtotop{
overflow:hidden;
position:fixed;
z-index:90;
right:30px; /*DISTANCIA DO BOTÃO EM RELAÇÃO A DIREITA*/
bottom:20px; /*DISTANCIA DO BOTÃO EM RELAÇÃO AO RODAPÉ*/
display:none;
width:42px; /*LARGURA DO BOTÃO*/
height:40px; /*ALTURA DO BOTÃO*/
line-height:24px;
padding-top:-15px; /*DISTANCIA DO ÍCONE EM RELAÇÃO AO TOPO DO BOTÃO*/
color:#ffffff; /*COR DA FONTE DO BOTÃO*/
text-align:center;
background:#000000; /*COR DE FUNDO DO BOTÃO*/
box-shadow: 0 3px 13px -5px #000; /*SOMBRA DO BOTÃO, APAGUE SE PREFERIR*/
font: 13px 'Open Sans'; /*TAMANHO E FONTE DO BOTÃO*/
text-indent:0;
cursor:pointer;
-webkit-transform:translateZ(0);
padding:4px 0 0;
text-align:center;
border-radius:0px;
transition:all .5s}
#backtotop:hover {
background-color:#FF0075; /*COR DE FUNDO DO BOTÃO EM ESTADO HOVER*/
color:#ffffff;/*COR DA FONTE DO BOTÃO HOVER*/
text-decoration: none !important;}



CÓDIGO JAVASCRIPT:

<script type='text/javascript'>
// Back to top
jQuery(document).ready(function(e){var t=e(&quot;#backtotop&quot;);e(window).scroll(function(){e(this).scrollTop()&gt;=500?t.show(10).animate({opacity:&quot;1&quot;},10):t.animate({opacity:&quot;0&quot;},10)});t.click(function(t){t.preventDefault();e(&quot;html,body&quot;).animate({scrollTop:0},400)})})
</script>

CÓDIGO HTML:

<a href='#' id='backtotop'><i class='fa fa-chevron-up'/>Topo</a>


Home Sobre mim Tutoriais Loja de templates Portfólio Fanpage