Показать сообщение отдельно
  #1 (permalink)  
Старый 05.07.2018, 10:04
Новичок на форуме
Отправить личное сообщение для tbny1 Посмотреть профиль Найти все сообщения от tbny1
 
Регистрация: 05.07.2018
Сообщений: 3

автоматическое сворачивание меню при нажатии ссылки
Здравствуйте. Нужна помощь доработать скрипт.
Требуется автоматическое сворачивание меню при нажатии ссылки.
(function(){
  'use strict';

  class Menu {
    constructor(settings) {
      this.nodeMenu = settings.nodeMenu;
      settings.nodeMenuButton.addEventListener('click', this.toggle.bind(this));
    }

    toggle() {
      return this.nodeMenu.classList.toggle('js-menu_activated');
    }
  }

  let nodeMenu = document.querySelector('body');
  
  new Menu({
    nodeMenu: nodeMenu,
    nodeMenuButton: nodeMenu.querySelector('.js-menu__toggle')
  });
})();

<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
	<div class="page">
		<div class="page__demo">
			<div class="page__container">
				<span class="page__name">Mobile Menu Animation</span>
				<span class="page__hint">Works better on mobile <a name="top">devices</a>. The hamburger button is <a name="pop">comfortably</a> available for a lefty and righty.</span>
      <a href="https://www.youtube.com/watch?v=org6Tmfp3PQ" rel="noopener noreferrer" target="_blank">YouTube video with the coding practice</a>
    </div>
  </div>
</div>
<header class="header">
  <div class="hamburger">
    <button class="button hamburger__button js-menu__toggle">
      <span class="hamburger__label">Open menu</span>
    </button>
  </div>
  <nav class="menu">
    <ul class="list menu__list">
      <li class="menu__group">
        <a href="#top" class="link menu__link">Home</a>
      </li>
      <li class="menu__group">
        <a href="#pop" class="link menu__link">About me</a>
      </li>
      </ul>
  </nav>
</header>
<script  src="js/index.js"></script>
</body>
</html>
Ответить с цитированием