Esqueceu
da criança
CURSO COMPLETO ONLINE
CRIE SEUS PRÓPRIOS DESENHOS ANIMADOS
Barata Tonta
Links da Semana
Bizolhando pela NET, encontrei sites
Um melhor do que o outro - (+18)

Botão Voltar Ao Topo Meio Transparente Personalizado no Centro do Blogger


Nesta postagem compartilho com vocês este novo botão de subir ao topo da página. dessa vez ele não fica no canto da tela como de costume, mas, fica no centro do blog facilitando assim a sua visibilidade e acessibilidade aos visitantes.




Para colocar em seu blog

Entre em "Layout" - "Adicionar um Gadget" - "HTML/JavaScript" e cole o seguinte código:
<style>#message a{display:block;display:none;z-index:999;opacity:.8;position:fixed;top:100%;margin-top:-75px;left:50%;margin-left:-90px;-moz-border-radius:3px;-webkit-border-radius:3px;padding:8px 40px 10px;background-color:#000;font-size:18px;text-align:center;color:#fff}</style>
<div class='go-top' id='message'><a href='#'>Voltar ao topo</a></div>
<script>
$(function () {
  $('.go-top').click(function () {
    $('html,body').animate({
      scrollTop: 0
    }, 1000);
    return false;
  });
});
</script>
<script type='text/javascript'>
//<![CDATA[
$(function () {
var scroll_timer;
var displayed = false;
var $message = $('#message a');
var $window = $(window);
var top = $(document.body).children(0).position().top;
$window.scroll(function () {
window.clearTimeout(scroll_timer);
scroll_timer = window.setTimeout(function () {
if($window.scrollTop() <= top)
{
displayed = false;
$message.fadeOut(500);
}
else if(displayed == false)
{
displayed = true;
$message.stop(true, true).show().click(function () { $message.fadeOut(500); });
}
}, 100);
});
});
//]]>
</script>
Tendo colado o código, basta salvar e pronto!!!

Deixe seu comentário.

Cursos On-line 24 Horas - Educação a Distância de Qualidade
Botão Voltar Ao Topo Meio Transparente Personalizado no Centro do Blogger Botão Voltar Ao Topo Meio Transparente Personalizado no Centro do Blogger Reviewed by Muca on 5/12/2014 12:23:00 PM Rating: 5