Eu acho que entendi, mas gostaria de saber se alguém conseguiria explicar de alguma outra maneira sobre o funcionamento do clique fora do menu e como ocorre o fechamento dele.
document.documentElement.onclick = function(event) {
if (event.target === document.documentElement) {
document.documentElement.classList.remove('menu-ativo');
}
};"Um ponto interessante a se observar é como pegar eventos no pseudo-elemento. Como pseudo-elementos são coisas de CSS, eles não podem ser selecionados no JavaScript para colocar um evento de clique. A solução é colocar o evento no elemento pai (no caso, no
, acessado via document.documentElement). Todo clique no pseudo-elemento vai disparar em seu respectivo pai.Mas é importante lembrar dos mecanismos de propagação de eventos do JS. Escutar cliques no
vai pegar todos os cliques na página, mesmo os do menu e outros elementos (afinal tudo é descendente de ). Para evitar isso, adicionamos o if que filtra a ação para executar apenas se o elemento clicado (target) for exatamente o e não algum filho interno, como menu."