Закрыть бургер меню по нажатию на ссылку

Имеется макет, где шапка состоит из ссылок, которые ведут к разным частям страницы по якорям(+анимация через js), проблема в том, что я не могу написать js код, который бы корректно закрывал это меню, и перемещение производилось бы корректно.

HTML:

<header class="header">
  <div class="container">
    <div class="menu">
      <nav class="menu__body">
        <ul class="menu__list">
          <li>
            <a href="" class="menu__item">Home</a>
          </li>
          <li>
            <a href="#about" class="menu__item">About me</a>
          </li>
          <li>
            <a href="#skills" class="menu__item">Skills</a>
          </li>
          <li>
            <a href="#port" class="menu__item">Portfolio</a>
          </li>
          <li>
            <a href="#contacts" class="menu__item">Contacts</a>
          </li>
        </ul>
      </nav>
      <div class="menu__burger"><span></span></div>
    </div>
  </div>
</header>

JS:

const burger = document.querySelector('.menu__burger');
const menu = document.querySelector('.menu__list');
const link = document.querySelector('.menu__item')


if (burger) {
  burger.addEventListener("click", function(e) {
    document.body.classList.toggle('lock');
    burger.classList.toggle('active');
    menu.classList.toggle('active');
  });

}

if (link) {
  link.addEventListener('click', function(e) {
    document.body.classList.remove('lock');
    menu.classList.remove('active');
    burger.classList.remove('active');
  });
}

const anchors = document.querySelectorAll("a[href*='#']")

for (let anchor of anchors) {
  anchor.addEventListener('click', function(e) {
    e.preventDefault();
    const blockID = anchor.getAttribute('href')
    document.querySelector(' ' + blockID).scrollIntoView({
      behavior: "smooth",
      block: 'start'
    })

  })
}

Ответы (0 шт):