Como adicionar uma barra de rolagem de rolagem automática no Blogger

 No passado, já mostramos como personalizar sua barra de rolagem no blogger com diferentes estilos, cores e personalização. Recentemente, um de nossos usuários nos perguntou como adicionar barra de rolagem automática no blogger que rola automaticamente a página de cima para baixo. Fazer sua barra de rolagem rolar automaticamente é uma maneira perfeita de forçar levemente seus leitores a percorrer toda a página antes de sair do seu site. Neste artigo, mostraremos como adicionar uma barra de rolagem de rolagem automática no blogger

O que é uma barra de rolagem?

Uma barra de rolagem é uma GUI (elemento de controle gráfico) que controla elementos como texto, imagens, vídeos e qualquer outra coisa disponível na página da web. Em outras palavras simples, é uma barra longa localizada no lado direito da tela pela qual um elemento pode ser rolado com a ajuda de um mouse.

Ele também tem duas setas para cima e para baixo que ajudam você a rolar para cima ou para baixo na página. Não é apenas para páginas da Web, mas você também pode encontrá-las em outros softwares como Word, Windows, Apple OS e etc.

Como adicionar a barra de rolagem de rolagem automática no Blogger?

A primeira coisa que você precisará fazer é primeiro fazer login na sua conta do blogger e selecionar um blog no qual você gostaria de adicionar a barra de rolagem automática. Agora vá para Template >> Edit HTML >> procure pela tag final </html> (você a encontrará no final dos códigos). Depois de encontrar </html> logo acima, cole o seguinte código:

<script>

    /*<![CDATA[*/

    var div = $('body');

    setInterval(function() {

            var pos = div.scrollTop();

            div.scrollTop(pos + 2);

        }, 10)

        /*]]>*/

</script>

<style>

    body {

        overflow-y: scroll;

    }

</style>

Você pode aumentar a velocidade de rolagem reduzindo o 10 no código acima. Enquanto, aumentar de 10 para 100 ou 1000 faria o pergaminho funcionar lentamente.

Essa técnica também pode ser aplicada a uma div, caso você queira rolar apenas um determinado elemento em seu site. Tudo o que você precisa fazer é substituir o corpo por um nome div do código acima. Como para <div id=”test”> a primeira linha do código se tornaria   var div = $('#test'); e vice versa.

Quando tudo estiver pronto, salve o modelo pressionando o botão “ Salvar modelo ” localizado na parte superior da tela. Parabéns, você instalou com sucesso o recurso de página de rolagem automática no blogger. Se você quiser limitar essa rolagem a determinadas páginas, confira para mostrar ou ocultar um widget em determinados URLs no blogger .

Esperamos que este artigo tenha ajudado a todos a aprender como adicionar uma barra de rolagem de rolagem automática no blogger. Compartilhe seus pensamentos sobre esta pequena, mas útil dica na seção de comentários abaixo. Se você tiver alguma sugestão ou solicitação, sinta-se à vontade para nos escrever usando nossa página de contato.