Neste artigo você vai aprender a como desativar eventos de um elemento em JavaScript, utilizando apenas CSS!
Fala programador(a), beleza? Bora aprender mais sobre os eventos de DOM!
Estranho pensar que uma regra de CSS pode resolver o nosso problema, certo?
Mas isso é até normal, pois HTML, CSS e JavaScript andam juntos em diversas questões
A regra em questão é a pointer-events, e vamos colocar um valor de none para ela
Isso faz com que o evento de click não funcione mais neste elemento, que geralmente é o nosso problema
Ocorre muito em duas situações:
- Elementos internos não deixando o evento do elemento externo ser executado;
- Elementos posicionados com absolute interrompendo os eventos de outros elementos;
Agora veja o código que você deve aplicar:
.el { pointer-events: none; }
Onde, é claro, você deve trocar .el para o seletor do elemento que você quer excluir o evento
Desta maneira o seu problema estará resolvido! 🙂
Bem simples, não acha?
Quer aprender mais sobre JavaScript? Confira o vídeo abaixo:
Conclusão
Neste artigo você viu como desativar eventos de um elemento em JavaScript
Utilizamos uma regra de CSS chamada pointer-events, que pode desabilitar os eventos de click
Para isso devemos colocar o valor da regra como none
Deseja programar de forma profissional? Confira o nosso treinamento completo clicando aqui.
Uma plataforma de cursos com projetos completos, comunidade de alunos e muito mais!
Há também o nosso canal no YouTube, com muito conteúdo gratuito de qualidade!