17 de ago. de 2010

Botão "ir ao topo" com efeito

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:
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.

]]></b:skin>

Cole o código abaixo.



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




Procure por: </body> cole o código abaixo acima dele.


<a href='#' id='toTop'><span class='Apple-style-span' style='font-family: Arial, Helvetica, sans-serif;'>&#9650; Ir para Topo</span></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>
 

4 comentários:

  1. falta por esse java aki kkk boa sorte


    'http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'

    att: www.glugu.com

    ResponderExcluir
  2. Adorei. Visitem meu Blog. É pra qm gosta de rock, uma banda francesa muito boa.

    ResponderExcluir
  3. Opa, adorei esse post, já to usando ^^
    Queria saber, pode me passar seu MSN ou algo do tipo, preciso tratar de um assunto contigo...

    E obrigado novamente pelo Post

    ResponderExcluir
  4. Poxa, coloquei, só que agora fui ver, a imagem não roda, digo, não aparece, fica só um quadrado com umas formas! Devo fazer o que ?

    ResponderExcluir

A legislação brasileira prevê a possibilidade de se responsabilizar o blogueiro pelo conteúdo do blog, inclusive quanto a comentários; portanto, o autor deste blog reserva a si o direito de não publicar comentários que firam a lei, a ética ou quaisquer outros princípios da boa convivência. Não serão aceitos comentários anônimos ou que envolvam crimes de calúnia, ofensa, falsidade ideológica, multiplicidade de nomes para um mesmo IP ou invasão de privacidade pessoal / familiar a qualquer pessoa. Comentários sobre assuntos que não são tratados aqui também poderão ser suprimidos, bem como comentários com links. Este é um espaço público e coletivo e merece ser mantido limpo para o bem-estar de todos nós.


Copyright © Templates e Acessórios |
Design by Elke di Barros | Tecnologia do Blogger
    Twitter Facebook Google + YouTube