none
Botão de ir para o topo relacionado ao Scroll RRS feed

  • Pergunta

  • Boa tarde, eu fiz o botão de subir para o topo e ficou legal, mas tive uma ideia que não sei se existe, era cada vez que mexo no scroll, independente de para cima ou para baixo, ele aparece o botão e quando parece de rolar o scroll o botão ficasse escondido... teria como fazer, alguém poderia me ajudar? 

    -html 

     <a href="#" id="subir" class="btvoltar" title="Voltar ao topo"><span class="glyphicon-topo glyphicon-hand-up" aria-hidden="true"></span></a>

    -css

    .btvoltar{
       
        bottom: 30px;
        right: 30px;
        height: 60px;
        width: 60px;
        border-radius: 100%;
        border: 2px solid #fff;
        background-color: #3b5998;
        color: #fff;
        text-align: center;
        opacity: 0.8;
    }

    .glyphicon-topo{
       
       
        display: inline-block;
        font-family: 'Glyphicons Halflings';
        font-style: normal;
        font-weight: normal;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        margin: 20px 0px;
    }

    .btvoltar:hover, .btvoltar:active, .btvoltar:focus {
        color: #fff;
        opacity: 1;
    }

    .btvoltar:hover{
        transition: 0.5s;
    }

    -JavaScript

    <script type="text/javascript">
        $(document).ready(function () {
           $('#subir').hide()

           $('#subir').click(function(){
              $('html, body').animate({scroll
          return false;
           });

           $(window).scroll(function () {

               if ($(this).scrollTop() > 300) {
                   $('#subir').fadeIn();
               }
               else {
                   $('#subir').fadeOut();
               }
           });
         });
    </script>


    sexta-feira, 29 de abril de 2016 18:17