Como deixar o scroll de uma página suave? (nice scroll)
Neste artigo você vai aprender a como deixar o scroll de uma página suave, implementando um nice scroll em seu projeto web com JavaScript!

Fala programador(a), beleza? Bora aprender mais sobre a biblioteca Nice Scroll e como implementá-la!
Primeiramente será necessário implementar o jQuery no projeto, podemos fazer isso via CDN, com a seguinte instrução:
Formação Claude Code
Domine Claude Code do absoluto zero até o avançado
- 118 aulas
- 4 projetos
- 9h 33min
<script src="https://code.jquery.com/jquery-3.5.1.js" integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc=" crossorigin="anonymous"></script>
Depois vamos adicionar a biblioteca Nice Scroll ao projeto, você pode checar a documentação clicando aqui, mas é bem fácil também
Vamos implementar a seguinte tag no nosso projeto:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.nicescroll/3.7.6/jquery.nicescroll.min.js" integrity="sha512-zMfrMAZYAlNClPKjN+JMuslK/B6sPM09BGvrWlW+cymmPmsUT1xJF3P4kxI3lOh9zypakSgWaTpY6vDJY/3Dig==" crossorigin="anonymous"></script>
Agora que temos todas as dependências instaladas, vamos simplesmente aplicar o Nice Scroll a um container, que queremos modificar o scroll
Veja a aplicação:
$("body").niceScroll();
Aqui aplicamos a todo o body, e agora o scroll estará modificado
Você pode fazer diversas customizações que a biblioteca permite, por exemplo:
- Alterar cor;
- Alterar largura;
- Cor de background;
- Raio das bordas;
- e muito mais;
Para outras modificações, sugiro ver a documentação oficial, que foi linkada acima
Conclusão
Neste artigo vimos como deixar o scroll de uma página suave
Utilizamos para atingir este objeto a biblioteca jQuery e também a Nice Scroll
Para utilizar a Nice Scroll, a lib jQuery é um pré requisito, pois foi construída em cima da mesma
Logo se eu projeto não for possível a adição, sugiro buscar uma solução nativa para resolver o problema
Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube
Formações
Formação Vibe Coding
Do Prompt ao Produto: Crie Software Real com IA
- 474 aulas
- 20 projetos
- 39h 27min
Blog | Mais populares
As diferenças de var, let e const

Como redirecionar para outra página com JavaScript
Exercícios de lógica de programação JavaScript com gabarito
Quais são os melhores exercícios lógica de programação JavaScript? Colocar em prática os exercícios de lógica de programação em JavaScript é de extrema importância para […]
