How to Make a Scroll-Activated Sticky Header in Your Wireframe Prototype?

Scroll-activated sticky header refers to a header that sticks to the top of the viewport when the page is scrolled down and disappears when the page is scrolled back to the top. To achieve this effect with Axure, the design will be cumbersome, because interactive designers need to insert variables or functions in your wireframe prototype. But how to use "Scroll Box" components with the rapid prototyping tools Mockplus to quickly make a scroll-activated sticky header? Could anyone here tell me?


You need to replicate changing the CSS position style to fixed from static depending on the scroll position of the window. In the browser, you can detect when the scroll position changes by adding on scroll listeners to the document.

In Axure you can add conditions to replicate this: see

Answered 7 years ago

Unlock Startups Unlimited

Access 20,000+ Startup Experts, 650+ masterclass videos, 1,000+ in-depth guides, and all the software tools you need to launch and grow quickly.

Already a member? Sign in

Copyright © 2024 LLC. All rights reserved.