Scroll zone A
Use this tall page to feel the sticky header effect. Hover Services / Elements for dropdowns.
.header-sticky-scroll-up + .header-dark — hide on scroll down, show on scroll up.
Scroll down to hide, then scroll up to bring the dark bar back.
Use this tall page to feel the sticky header effect. Hover Services / Elements for dropdowns.
Options live on #header via data-header-sticky JSON.
Works with ScrollSmoother — header reads smoothed scroll position.
Extra vertical room so hide / reveal / shrink / scroll-up states are obvious inside the iframe preview.
Sticky behavior is driven by a single StickyHeader loop in base.js.
Effect priority: reveal → scroll-up → shrink → static.
Events: mysia:stickyHeader.activate and
mysia:stickyHeader.deactivate fire when the docked state toggles.
Scroll back up to reset the header resting state.