diff --git a/src/js/scripts.js b/src/js/scripts.js index ad13924..33fdd4a 100644 --- a/src/js/scripts.js +++ b/src/js/scripts.js @@ -28,15 +28,39 @@ window.addEventListener('pageshow', () => document.addEventListener('DOMContentLoaded', () => { + /** + * @type {HTMLDivElement} + */ + const navBar = document.getElementById('navbarNav'); + /** + * @type {NodeListOf} + */ + const navLinks = navBar.querySelectorAll('a.nav-link'); /** * @type {NodeListOf} */ const sectionsWithId = document.querySelectorAll('section[id]'); + // Update nav links and add anchor links to section headers. sectionsWithId.forEach(anchorTarget => { + // Navigate within current page if a section for the anchor exists. + navLinks.forEach(navLink => + { + const href = navLink.getAttribute('href'); + + if (href.startsWith('/#') && href.substring(2) === anchorTarget.id) + { + navLink.setAttribute('href', href.substring(1)); + } + }); + + /** + * @type {HTMLHeadingElement|null} + */ const anchorHeader = anchorTarget.querySelector('h1,h2'); + // Add anchor link to section header. if (anchorHeader) { const anchorLink = document.createElement('a'); @@ -48,7 +72,7 @@ document.addEventListener('DOMContentLoaded', () => }); // Collapse the navbar in mobile view after clicking a link. - document.querySelectorAll('#navbarNav li.nav-item>a').forEach(navLink => + navLinks.forEach(navLink => { navLink.addEventListener('click', () => {