Dynamic header in mobile website

Hello, I want the header of my mobile website to move up (and out of the viewport) with the page content when I scroll down the page but to appear immediately once I start to scroll up. (When scrolling the content all to the top of the page it should stay sticked to the browser window).
I got crazy trying this - maybe you can help me?

matsbats

Hi,
Try to put On scroll action with Show and make Dynamic panel sticky, see this it could help https://www.axure.com/support/training/scroll-activated-sticky-header-tutorial

Greets Karel

Karel, thanks for your help. The solution works pretty fine on a desktop browser - when I open it on a mobile browser it all starts to flicker. I guess it’s due to the fact that the scroll action is repeated during the scroll action?

Another problem with this solution is: when I scroll up completely and the content bounces (the native behaviour of the website content), the panel disappears. Probably because the page moves down (even though it’s not a scroll action).

Can you help me with that? Would be great as I have a user test in a couple of days :grimacing:

Hi put source there so I can try to help.
Best Karel

That’s great, thanks a lot.
Header Test.rp (177.7 KB)