Dynamic sticky header (old instagram)

newbie-question

#1

How to create dynamic sticky header like instagram used to have? In profile cards, header remains on top of display until header below hets to the top of display when you scroll. Is this possible with axure?


#2

You can use onScroll


#3

If I understand this correctly you’ll have to create 2 headers and place them in separate dynamic panels. You’ll then have to Pin one of them to the browser. From there you’ll have to use onScroll action to check when the user has scrolled to a certain point on the page and then hide the Pinned Header and show the unpinned header which will then continue to scroll.


#4

This is how I accomplished the sticky feature as well. Mine was a sticky footer. :slight_smile:


#5

Thank you for tip, i will try.


#6

Hello, I guess my example can help you, here : 2 Sticky Menus on the same page

I hope this will help :slight_smile:

Murat


#7

Hey, thank you. I will take a look at it :). Do you have final version?


#8

Can I see a screenshort of the Instagram, As I do have the app so can’t really understand fully how you want the sticky header. However, you can use pin to browser to get sticky headers


unlisted #9

closed #10