Eu poderia começar esse post de diversas maneiras porem todas essas formas seriam muito clichê e que não quer dizer que essa forma também seria.

Indo direto no que interessa, nesse post aqui vou tratar de uma função interessante e que nesse momento ainda vou buscar aprender e deixar guardado aqui como forma de consulta posterior.

Depois de muita pesquisa na internet eu pude encontrar uma simples função em jQuery que faz a página rolar até o topo durante um tempo estabelecido.

Mãos a obra.

Instalando a biblioteca do jQuery

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Devemos colocar esse código no rodapé de seu site, antes do fechamento da tag body (</body>).

A função em jQuery que faz toda a mágica será essa aqui em baixo.

<script type="text/javascript">
function topTop(){
 var totop = $(window).scrollTop()-8;
 if(totop <= 0){
     clearInterval(idInterval);
 }else{
     totop--;
     $(window).scrollTop(totop);
 }
}
function levTop(){
 idInterval = setInterval('topTop();', 1);
}
</script>

Devemos clocar esse bloco de código abaixo do bloco inserido no passo anterior, ou em um arquivo .js, separado e incluir ele no corpo do site com a função script.

<script src=”js/funcoes.js”></script>

Obs: se optarmos por usar um arquivo separado, devemos remover as tags de iniciação e fechamento da tag script.

Por ultimo agora só precisamos chamar a função no botão que irá levar a página para o topo.

<a class=”navbar-brand” href=”javascript:levTop();”>Ir para o topo</a>

Com isso, se tudo der certo teremos um efeito de rolagem bem bacana.