Dúvida Menu Responsivo. | Web Design Responsivo: Páginas que se adaptam do mobile ao desk

Solucionado (ver solução)

Solucionado
(ver solução)

2
respostas

por Alexandre Gomes Quintas

| 253k xp | 3 posts

Esse é o meu código:

$('.menu-abrir').on('click', function() {
    $('html').addClass('menu-ativo');
});

$('.menu-fechar').on('click', function() {
    $('html').removeClass('menu-ativo');
});

$('html').on('click', function(event) {
    if (event.target === document.documentElement) {
        $(this).removeClass('menu-ativo');
    }
});

Ele está funcionando normal. A unica coisa que eu não entendi foi o fato de não funcionar dentro do IF o $('html') ou $(this), funcionando somente o "document.documentElement". Gostaria que alguém me tirasse esta dúvida.

2 respostas

solução!

por Sérgio Lopes

| 603.7k xp | 913 posts

Instrutor CTO na Alura

21/05/2016

É pq o event.target devolve um objeto dom puro. Aí vc tem que comparar com o objeto dom correspondente, não com o objeto jQuery que viria se chamar $.

Ou vc embrulha o event.target num objeto jQuery e faz a comparação com jQuery. Seria outra forma tbm...

por Alexandre Gomes Quintas

| 253k xp | 3 posts

23/05/2016

Tentei fazer deste jeito só que não funcionou.

$('.menu-abrir').on('click', function() {
    $('html').addClass('menu-ativo');
});

$('.menu-fechar').on('click', function() {
    $('html').removeClass('menu-ativo');
});

$('html').on('click', function(event) {
    if ($(event.target) === $('html')) {
        $(this).removeClass('menu-ativo');
    }
});