Como desabilitar o scroll botão do do mouse com JavaScript

Neste artigo você vai aprender a como desabilitar o scroll botão do do mouse com JavaScript de uma maneira super simples e eficaz

Conteúdo também disponível em vídeo:

Fala programador(a), beleza? Bora aprender mais sobre scroll, DOM e JavaScript!

Para desabilitar o botão do scroll vamos mapear um evento de onmousedown

Formação Recomendada

Formação Claude Code

Domine Claude Code do absoluto zero até o avançado

• 120 aulas
• 4 projetos
• 9h 45min

Conhecer formação

Este evento serve para verificar quando um botão do mouse é pressionado

O código do botão do scroll é 1, então vamos identificar o código um e fazer o bloqueio da ação

Utilizando um argumento de evento, que é fornecido em todos os eventos de JS

Vamos retornar false, quando acontecer o evento que não desejamos

Veja o código com a situação resolvida:

document.body.onmousedown = function(e){
    if(e.button == 1) {
      return false;
    }
}

Este código acima remove a ação do botão do meio ou botão do scroll com JavaScript

Você pode inserir um console.log dentro do if e verificar a mensagem sendo exibida caso o botão for pressionado

Outra alternativa com JS puro é:

document.addEventListener("mousedown", function(e) {

  if(e.button === 1) {

    return false;

  }

});

Podemos realizar esta ação com jQuery também, veja:

$('body').mousedown(function(e){
    if(e.button==1){
      alert('Botão desabilitado');
      return false
    }
});

Neste código removemos o efeito do botão central com jQuery

Lembrando que os códigos do mouse são:

• 0: botão esquerdo
• 1: botão do meio ou de scroll
• 2: botão direito

Conclusão

Neste artigo você viu como desabilitar o scroll botão do do mouse com JavaScript

Podemos utilizar o evento onmousedown, que verifica as ações com mouse

E então bloqueamos o evento do botão 1, que é o do centro

Porém você também pode trabalhar com os outros eventos, utilizando 0 para o botão esquerdo e 2 para o botão direito

Aí é só adicionar a lógica correta para a sua regra de negócio

Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube