Web Pro Dragons

Internal Dev Library

Sticky header – hides when scrolling up but remains visible at the top and when scrolling down.

				
					<script>
document.addEventListener('DOMContentLoaded', function() {
    const header = document.querySelector('.elementor-element-b0ccf92'); // your header
    let lastScroll = 0;

    window.addEventListener('scroll', function() {
        const currentScroll = window.pageYOffset || document.documentElement.scrollTop;

        if (currentScroll === 0) {
            // At very top, header is visible
            header.style.transform = 'translateY(0)';
        } else if (currentScroll < lastScroll) {
            // Scrolling up, hide header
            header.style.transform = 'translateY(-100%)';
        } else {
            // Scrolling down, show header
            header.style.transform = 'translateY(0)';
        }

        lastScroll = currentScroll;
    });
});
</script>