В нормальных браузерах в мобильном режиме при клике на гамбургер открывается мобильное меню и body присваивается класс с overflow: hidden, чтобы избежать скролла вниз при открытом меню. При закрытии меню класс убирается. При клике на пункт меню этот класс также убирается и срабатывает скролл к нужной секции. Но в IE при клике на пункт меню в мобильном режиме скролл к нужно секции срабатывает, а класс не убирается. В результате скролл в ручную не работает и приходится обновлять страницу, чтобы появилась возможность скролла.
https://burobsn.ru
Код дан в первоначальном виде до прогонки через babel для поддержки IE. Все остальные скрипты в IE работают нормально. Проблема только в этом.
;(function() {
const hamburger = document.getElementById('menu__button');
const nav = document.querySelector('.nav')
const navList = document.querySelector('.nav-list');
const menuLinks = document.querySelectorAll('.nav__link');
const body = document.getElementsByTagName('body')[0];
let screenWidth = window.screen.availWidth;
hamburger.addEventListener('click', mobileMenu);
function mobileMenuLinkClick() {
menuLinks.forEach(link => {
link.addEventListener('click', () => {
if (screenWidth < 1024) {
mobileMenuHide();
}
});
});
}
mobileMenuLinkClick();
function mobileMenu() {
if(!hamburger.classList.contains('active')) {
hamburger.classList.add('active');
nav.classList.add('nav--open');
navList.classList.add('nav-list--open');
body.classList.add('no-scroll');
} else {
mobileMenuHide();
}
}
function mobileMenuHide() {
hamburger.classList.remove('active');
nav.classList.remove('nav--open');
navList.classList.remove('nav-list--open');
body.classList.remove('no-scroll');
}
function menuLinksShow() {
menuLinks.forEach(link => {
link.style.opacity = '1';
});
}
function menuLinksHide() {
menuLinks.forEach(link => {
link.style.opacity = '0';
});
}
window.addEventListener('resize', () => {
screenWidth = window.screen.availWidth;
if (screenWidth > 1024) {
menuLinksShow();
hamburger.classList.remove('active');
nav.classList.remove('nav--open');
navList.classList.remove('nav-list--open');
body.classList.remove('no-scroll');
}
});
})();
