Adds an is-scrolled class to the website header after the user scrolls 50 pixels, making it easy to create sticky header and scroll-based styling effects.
document.addEventListener('DOMContentLoaded', function () {
const header = document.querySelector('.site-header');
if (!header) {
return;
}
function handleScroll() {
header.classList.toggle('is-scrolled', window.scrollY > 50);
}
handleScroll();
window.addEventListener('scroll', handleScroll);
});
