Как закрыть панель навигации при нажатии на элемент - PullRequest
Новая
       10

Как закрыть панель навигации при нажатии на элемент

1 голос
/ 25 апреля 2019

Моя панель навигации отображается на половине экрана, когда отображается в мобильном режиме, и я пытаюсь закрыть ее после нажатия на элемент, вместо того, чтобы закрывать его, только нажав на «X»

Я не настолько опытен в JavaScript, я все еще учусь, я пытался взглянуть на онлайн-учебники, но не увенчался успехом.

Вот HTML-код для панели навигации: 

<nav>
<div class="logo">
  <h4> Example</h4>
</div>
<ul class="nav-links">
  <li><a href="#About">About Us</a></li>
  <li><a href="#Services">Services</a></li>
  <li><a href="#Contact">Contact Us</a></li>
</ul>
<div class="burger">
  <div class="line1"></div>
  <div class="line2"></div>
  <div class="line3"></div>
</div>
</nav>

Вот Javascript: 

const navSlide = () => {
const burger = document.querySelector('.burger');
const nav = document.querySelector('.nav-links');
const navLinks = document.querySelectorAll('.nav-links li');

burger.addEventListener('click', () => {
nav.classList.toggle('nav-active');

navLinks.forEach((link, index) => {
  if (link.style.animation) {
    link.style.animation = '';
  } else {
    link.style.animation = `navLinkFade 0.5s ease forwards ${index / 7 + 
0.5}s`;
  }
 });
burger.classList.toggle('toggle');

});

}

navSlide();

Я ожидаю, что панель навигации будет закрыта после нажатия на элемент, а также возможность закрытия, нажав «X»

...