const sections = document.querySelectorAll("section[id]"); const navLinks = document.querySelectorAll(".case-nav a"); let lastScroll = window.pageYOffset; window.addEventListener("scroll", () => { const currentScroll = window.pageYOffset; const nav = document.querySelector(".case-nav"); // Hide on scroll down if(currentScroll > lastScroll + 8){ nav.classList.add("hide"); } // Show on scroll up if(currentScroll < lastScroll - 8){ nav.classList.remove("hide"); } lastScroll = currentScroll; // Active section let current = ""; sections.forEach(section=>{ const top = section.offsetTop - 180; if(currentScroll >= top){ current = section.getAttribute("id"); } }); navLinks.forEach(link=>{ link.classList.remove("active"); if(link.getAttribute("href")==="#"+current){ link.classList.add("active"); } }); // Progress const docHeight = document.documentElement.scrollHeight - window.innerHeight; const progress = (currentScroll/docHeight)*100; document.querySelector(".progress") .style.setProperty("--progress",progress+"%"); });