0

Есть одностраничник с адаптивным меню. При клике на пункт меню страница прокручивается к нужному якорю, но меню остается открытым, перекрывая собой половину страницы (на телефоне). Чтобы скрыть его, нужно кликать по той же кнопке, что и для открытия. Неудобно. Можно ли сделать так, чтобы меню скрывалось при клике по пункту меню (или на любом другом месте страницы вне меню)?

HTML

<div class="menu-mobile col-xs-10 pull-right cssmenu">
            <i class="mdi mdi-menu menu-toggle"></i>
            <ul class="menu" id='parallax-mobile-menu'>
            </ul>
        </div>

JS

    CALIBER_SETTINGS.mobileMenu = function() {

    var mobile_str = "";
    $(".menu-ul").each(function() {
        mobile_str += $(this).html();
    });

    $(".menu-mobile ul.menu").html(mobile_str);

    $(".menu-toggle ").on('click', function() {
        $(".menu-mobile.cssmenu").toggleClass("open");
        $(this).toggleClass("mdi-menu mdi-close");
    });

    $('.menu-mobile.cssmenu li.has-sub').on('click', function(e) {
        $(this).parent().children("ul").toggleClass("open");
        $(this).find("i").toggleClass("open");
        e.stopPropagation();
    });
}

1 ответ 1

1

Как-то так:

querySelectorAll('li').forEach(function(e) {
  e.addEventListener('click', function() {
    e.parentNode.classList.remove('open');
  })
})
1
  • А не подскажите, как использовать этот код? 21 мая 2017 в 21:31

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.