Como colocar botão de subir ao top no blog

Bom Pessoal nesse tutorial vou tar ensinando como colcoar aquele botao de subir ao topo no blog ok.Vamos la

Primeiramente va no painel do seu blog e click em DESIGN depois em  EDITAR HTML

dae vocês dao um CTRL+F e procurem pela tag  ]]></b:skin>

e colem esse codigo antes dela 


    /* to top */

    #toTop {


    width:50px;  /* Largura do botão * /
    background: #FF0000; /* Cor do botão*/
    border:1px solid #000; /* Cor da borda */
    text-align:center; /* Alinhamento do texto */
    padding:5px; /* Distancia entre texto e borda */
    position:fixed; /* Posição que faz com que ele corra por toda a página*/
    bottom:5px;
    right:5px;
    cursor:pointer;
    color:#eee; /* Cor da letra */
    text-decoration:none;
    font-weight:700;  /* Tamanho da letra */

    -moz-border-radius:5px;  /* Definições para o angulo do botão */
    -khtml-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    }

  procurem esse outra tag  </body>

e cole esse codigo antes dela

  <a href='#' id='toTop'>&#9650; Topo</a>

    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

    <script type='text/javascript'>
    /*-----------------------
    * jQuery Plugin: Scroll to Top
    * by Craig Wilson, Ph.Creative (http://www.ph-creative.com)
    *
    * Copyright (c) 2009 Ph.Creative Ltd.
    * Description: Adds an unobtrusive &quot;Scroll to Top&quot; link to your page with smooth scrolling.
    * For usage instructions and version updates to go http://blog.ph-creative.com/post/jquery-plugin-scroll-to-top.aspx
    *
    * Version: 1.0, 12/03/2009
    -----------------------*/

    $(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;#toTop&quot;).scrollToTop();
                });
            </script>

Apos isso de um vizualizar para ver se não ficou nenhum erro e salvem o modelo e pronto ok pessoal espero ter ajudado

0 comentários:

Postar um comentário