При клике в пустое место открывается меню, как испраивть?
подскажите пожалуйста. Есть меню, которое вызывается по кнопке "материалы" и "бургер", но при клике в пустое место оно тоже вызывается, как исправить? Спасибо
$(function() {
var $res = $(".header__menu");
$(".open-menu").on("click", funk);
$(document).click(function(e) {
if (!$(e.target).hasClass('open-menu')) funk(false);
});
$('.header__menu').on('click', function(e) { e.stopPropagation() });
function funk(flag) {
$res.fadeToggle();
}
});
.container {
display: flex;
}
.header__list--item {
padding: 18px 32px;
background: blue;
color: #fff;
text-align: center;
cursor: pointer;
}
.burger-click {
padding: 18px 32px;
background: green;
color: #fff;
text-align: center;
cursor: pointer;
}
.header__menu {
display: none;
background: red;
padding: 52px 18px;
text-align: center;
color: #fff;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
<div class="header__list--item open-menu menu-click">Материалы</div>
<div class="header__list--item open-menu burger-click">Бургер</div>
</div>
<div class="header__menu">
Контетн
</div>
Ответы (1 шт):
Автор решения: Pavel Nazarian
→ Ссылка
funk(false) замените на $res.fadeOut()
$(function() {
var $res = $(".header__menu");
$(".open-menu").on("click", funk);
$(document).click(function(e) {
if (!$(e.target).hasClass('open-menu')) $res.fadeOut();
});
$('.header__menu').on('click', function(e) { e.stopPropagation() });
function funk(flag) {
$res.fadeToggle();
}
});
.container {
display: flex;
}
.header__list--item {
padding: 18px 32px;
background: blue;
color: #fff;
text-align: center;
cursor: pointer;
}
.burger-click {
padding: 18px 32px;
background: green;
color: #fff;
text-align: center;
cursor: pointer;
}
.header__menu {
display: none;
background: red;
padding: 52px 18px;
text-align: center;
color: #fff;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
<div class="header__list--item open-menu menu-click">Материалы</div>
<div class="header__list--item open-menu burger-click">Бургер</div>
</div>
<div class="header__menu">
Контетн
</div>