(() => {
const framerName = "PASTE_NAME_HERE"; // <-- replace this
const threshold = 10; // px scrolled before turning opaque
const opaque = "#0f0f0f";
function apply() {
const scrolled = window.scrollY > threshold;
document.querySelectorAll(`[data-framer-name="${framerName}"]`).forEach(el => {
el.style.transition = "background-color 200ms ease";
el.style.backgroundColor = scrolled ? opaque : "transparent";
});
}
// Run now + on scroll
apply();
window.addEventListener("scroll", apply, { passive: true });
// Also re-apply after Framer finishes loading elements
setTimeout(apply, 300);
setTimeout(apply, 1000);
})();