Search

Depureco News, Events & Blog

LATEST ARTICLES

Contact Us

Request a free quote

(() => { const ACTIVE_CLASS = "is-active"; const MENU_SELECTORS = [ ".wheels-container", ".stationary-container", ".heavy-container", ".supercharged-container", ]; // Your section IDs (final) const FALLBACK_SECTION_BY_MENU = { ".wheels-container": "#cvs-wheels", ".stationary-container": "#cvs-stationary", ".heavy-container": "#cvs-heavy", ".supercharged-container": "#cvs-supercharged", }; // --- Helpers to keep sticky offsets correct --- function setHeights() { const adminbar = document.querySelector("#wpadminbar"); const adminH = adminbar ? adminbar.getBoundingClientRect().height : 0; // Try common header selectors (Elementor varies by theme) const header = document.querySelector("header.elementor-sticky--effects") || document.querySelector(".elementor-location-header header") || document.querySelector("header") || document.querySelector(".elementor-sticky"); const headerH = header ? header.getBoundingClientRect().height : 0; const menu = document.querySelector("#cvs-menu"); const menuH = menu ? menu.getBoundingClientRect().height : 0; document.documentElement.style.setProperty("--cvs-adminbar-h", `${adminH}px`); document.documentElement.style.setProperty("--cvs-header-h", `${headerH}px`); document.documentElement.style.setProperty("--cvs-menu-h", `${menuH}px`); } function initScrollSpy() { const menu = document.querySelector("#cvs-menu"); if (!menu) return false; const map = []; // { menuEl, sectionEl, id } for (const sel of MENU_SELECTORS) { const menuEl = menu.querySelector(sel) || document.querySelector(sel); if (!menuEl) continue; // Preferred: const a = menuEl.querySelector('a[href^="#"]'); let sectionEl = null; if (a) { const href = a.getAttribute("href"); if (href && href.length > 1) sectionEl = document.querySelector(href); } // Fallback mapping if (!sectionEl) { const fallbackSel = FALLBACK_SECTION_BY_MENU[sel]; if (fallbackSel) sectionEl = document.querySelector(fallbackSel); } if (sectionEl && sectionEl.id) { map.push({ menuEl, sectionEl, id: sectionEl.id }); } } if (!map.length) return false; const clearActive = () => map.forEach(x => x.menuEl.classList.remove(ACTIVE_CLASS)); const setActive = (id) => { clearActive(); const hit = map.find(x => x.id === id); if (hit) hit.menuEl.classList.add(ACTIVE_CLASS); }; // Track intersection ratios to choose the “most visible” section const ratios = new Map(map.map(x => [x.id, 0])); let current = null; const io = new IntersectionObserver((entries) => { for (const entry of entries) { const id = entry.target.id; if (!id) continue; ratios.set(id, entry.isIntersecting ? entry.intersectionRatio : 0); } let bestId = null; let bestRatio = 0; for (const [id, r] of ratios.entries()) { if (r > bestRatio) { bestRatio = r; bestId = id; } } if (bestId && bestId !== current) { current = bestId; setActive(bestId); } }, { root: null, // Switch when section enters upper half-ish of viewport rootMargin: "-20% 0px -55% 0px", threshold: [0.05, 0.15, 0.25, 0.35, 0.5, 0.65, 0.8] }); map.forEach(x => io.observe(x.sectionEl)); // Initial active setTimeout(() => { const first = map.find(x => { const r = x.sectionEl.getBoundingClientRect(); return r.top < window.innerHeight * 0.55 && r.bottom > 0; }) || map[0]; setActive(first.id); }, 50); // Smooth scroll (respects offsets) for (const { menuEl, sectionEl } of map) { const link = menuEl.querySelector('a[href^="#"]'); if (!link) continue; link.addEventListener("click", (e) => { e.preventDefault(); setHeights(); const headerH = parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--cvs-header-h")) || 0; const adminH = parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--cvs-adminbar-h")) || 0; const menuH = parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--cvs-menu-h")) || 0; const y = sectionEl.getBoundingClientRect().top + window.pageYOffset - (headerH + adminH + menuH + 16); const prefersReduced = window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches; window.scrollTo({ top: y, behavior: prefersReduced ? "auto" : "smooth" }); }); } return true; } // Elementor renders late; retry a few times let tries = 0; const timer = setInterval(() => { tries++; setHeights(); if (initScrollSpy() || tries >= 12) clearInterval(timer); }, 350); // Keep offsets accurate on resize + scroll (collapsing header, etc.) window.addEventListener("resize", () => setHeights(), { passive: true }); window.addEventListener("scroll", () => setHeights(), { passive: true }); })();