@hlebka

Как при клике на ссылку закрывалось hamburger меню?

Здравствуйте,
Есть hamburger меню который отображается на чекпоинте media (max-width:767px). При клике на ссылку переход к якорю работает должным образом, но чтобы показать содержимое, нужно закрыть меню. Помогите пожалуйста сделать скрипт, который будет закрывать меню, после клика на ссылку.

Ссылка на codepen - HTML+CSS+JS (jQuery)
https://codepen.io/hlebka/pen/BaPvBGd

Upd: решено, в codepen готовый результат HTML+CSS+JS (jQuery), можно пользоваться.
  • Вопрос задан
  • 505 просмотров
Решения вопроса 2
DanArst
@DanArst Куратор тега CSS
Гриффиндор в моде при любой погоде!
$('.header__burger, .header__link').click(function (event) {
        $('.header__burger, .header__menu').toggleClass('active');
        $('body').toggleClass('lock');
});
Ответ написан
Комментировать
@filmanovichviktor
Здравствуйте. Если вам не принципиален jQuery, то вот решение на чистом JavaScript.

const burger = document.querySelector(".header__burger");
const menu = document.querySelector(".header__menu");
const menuLinks = document.querySelectorAll(".header__link");

burger.addEventListener("click", () => {
  menu.classList.toggle("active");
  burger.classList.toggle("active");
});

menuLinks.forEach((link) =>
  link.addEventListener("click", () => {
    menu.classList.remove("active");
    burger.classList.remove("active");
  })
);
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы