Как закрыть область по клику за ней. Функция на чистом JavaScript.
Также есть статья, как сделать то же самое на jQuery.
JS код:
window.addEventListener('click', function (e) {
if (!menu.contains(e.target) && !button.contains(e.target)) {
// Ниже код, который нужно выполнить при срабатывании события.
menu.classList.add('hide');
}
});
if (!menu.contains(e.target) && !button.contains(e.target)) {
// Ниже код, который нужно выполнить при срабатывании события.
menu.classList.add('hide');
}
});
Вместо класса добавляющего скрытие:
menu.classList.add('hide');
Можно применить стиль сокрытия:
menu.style.display = 'none';
Если нужно, чтобы меню вновь открывалось по кнопке, стоит поставить исключение на неё. В коде выше это было сделано этим !button.contains(e.target).