Lorky

Discontinued navbar | JS

Dec 26th, 2022
2,907
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 0.78 KB | Source Code | 0 0
  1.   // nav
  2.   const navBtns = document.querySelectorAll('.nav-btn');
  3.  
  4. navBtns.forEach(btn => {
  5.   btn.addEventListener('click', () => {
  6.     const sectionId = btn.getAttribute('data-section');
  7.     const sections = document.querySelectorAll('section');
  8.  
  9.     sections.forEach(section => {
  10.       if (section.classList.contains(sectionId)) {
  11.         section.classList.add('active');
  12.       } else {
  13.         section.classList.remove('active');
  14.       }
  15.     });
  16.   });
  17.  
  18.  
  19.   navBtns.forEach(btn => {
  20.     btn.addEventListener('mouseenter', () => {
  21.       const text = btn.querySelector('.text');
  22.       text.style.display = 'inline';
  23.     });
  24.  
  25.     btn.addEventListener('mouseleave', () => {
  26.       const text = btn.querySelector('.text');
  27.       text.style.display = 'none';
  28.     });
  29.   });
  30. });
Advertisement
Add Comment
Please, Sign In to add comment