столкнулся с такой проблемой, есть меню, на десктопе оно прекрасно работает, на мобильной версии при нажатии на кнопку меню сразу же пропадает
Ниже код:
$(document).ready(function() {
var res = $(".dropdown-menu");
$(".menu-burger").on("click", funk);
$(document).click(function (e) {
if (!$(e.target).parents().hasClass('menu-burger')) funk(false);
});
function funk(flag) {
if (res.css("display") == "none" && flag) {
res.fadeIn(300);
} else {
res.fadeOut(300);
}
}
});
.header__headings {
color: red;
font-weight: bold;
}
.header__burger-mobile {
color: blue;
font-weight: bold;
padding-top: 15px;
}
.dropdown-menu {
display: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<div class="header__headings menu-burger">
<span class="burger"></span>
<span class="title">Все рубрики</span>
</div>
<div class="header__burger-mobile menu-burger">Меню</div>
<div class="dropdown-menu">
<div class="dropdown-menu__caption"># Все рубрики</div>
</div>
Как можно решить данную проблему?