Pages

Pesquisar

Mostrando postagens com marcador botão ir ao topo. Mostrar todas as postagens
Mostrando postagens com marcador botão ir ao topo. Mostrar todas as postagens

saiba como se faz:..."Botão "ir ao topo" com efeito

fonte e creditos deste presente post:
templateseacessorios


Botão "  ir ao topo"    com efeito

"    Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo."

 


Coloque um botão para ir ao topo  (exemplo) do seu blog com efeito. 

Então vá até o HTML de seu blog e antes de: 
    
 

]]></b:skin>

Cole o código abaixo.




/* Up header----------------------------------------------*/


#upheader {
width:100px;
color:#fff; /*cor da letra*/
background:#808080; /*cor de fundo*/
border:1px solid #ccc;/*cor da bordas*/
text-align:center;
padding:5px;
position:fixed;
bottom:10px;
right:10px;
text-decoration:none;
}


Abaixo de ]]></b:skin> cole o código abaixo.


<script type='text/javascript'>
$(function(){$.fn.scrollupheader=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="0"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="0"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:0},"slow")})}});
$(function() {
$("#upheader").scrollupheader();
});
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
 

Procure então por </body> e acima dele cole o código abaixo.

<a href='#' id='upheader'>Topo ▲</a>

Se preferir colocar uma imagem de seta o código será esse, Não se esqueça no entanto de apagar oa parte do primeiro código que está em negrito.

<a href='#' id='upheader'><img src="AQUI O ENDEREÇO DA IMAGEM"/></a>

...


Leia Mais ►

Formulário de contato

Nome

E-mail *

Mensagem *

 

Lorem ipsum

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec libero. Suspendisse bibendum. Cras id urna. Morbi tincidunt, orci ac convallis aliquam, lectus turpis varius lorem, eu posuere nunc justo tempus leo. Donec mattis, purus nec placerat bibendum, dui pede condimentum odio, ac blandit ante orci ut diam.

Images Gallery

pix pix pix pix pix pix

Total de visualizações de página

visitas