/** * @type {NodeListOf} */ const parallaxElems = document.querySelectorAll('.parallax'); /** * @type {NodeListOf} */ const sections = document.querySelectorAll('.section'); // Handle scroll events. window.addEventListener('scroll', () => { // Add class to body when scrolled. document.body.classList.toggle('is-scrolled', window.scrollY > 0); // Parallax effect. parallaxElems.forEach(parallaxElem => { const parentElem = parallaxElem.parentElement; const parentRect = parentElem.getBoundingClientRect(); const parentScroll = parentRect.top + (parentRect.height / 2); const windowScroll = window.scrollY + (window.innerHeight / 2); parallaxElem.style.top = `${(windowScroll - parentScroll) / 4}px`; }); }); sections.forEach(section => { if (section.id) { const anchor = document.createElement('a'); anchor.className = 'anchor-link'; anchor.href = `#${section.id}`; anchor.innerHTML = ' # '; section.appendChild(anchor); } }); document.querySelectorAll('#navbarNav li.nav-item>a').forEach(anchor => { anchor.addEventListener('click', () => { /** * @type {HTMLButtonElement} */ const navbarNav = document.querySelector('button.navbar-toggler[aria-expanded="true"]'); navbarNav?.click(); }); });