How to fix the position of header while scrolling

[babacar5CAA]

Hi everyone, I make a prototype in XD and when i scroll down I want the head of my page to move a bit and stop moving so that it doesn't disappear completely.

Is it possible? If yes how?

{Renamed By MOD}

[Rishabh_Tiwari]

Hi there,

Thanks for reaching out. If I understood it correctly, you are looking to fix the header while scrolling? If yes, you can refer to this article: https://helpx.adobe.com/xd/help/create-scrollable-artboards.ug.html

Let us know if this helps or if you need any further assistance.

Regards

Rishabh

[babacar5CAA]

Hi,

Thank you very much for your response, it was informative for me.

Actually my header is a bit too big and I want it to be fixed after the page has scrolled a bit so the top of the header can disappear.
Consider that it is made up of 3 lines, I want all lines to scroll with the page until the first two lines that are at the top disappear; the only remaining will therefore not be disturbing by its size.

Regards

Babacar

[Spas K. · Accepted solution]

Right now you can make a fixed header, but it will be fixed from the start. From what I understand you want it to become fixed after the page is scrolled a bit. There's no built in functionality for this, but there is sort of a workaround for it.

You can do this by making 2 versions of the header:

- One default version, when you are at the top of the page, that is not fixed.

- One "sticky" version, that is usually smaller and is fixed to the top of the page.

You can put the big header on top, so that it hides the smaller header. You can also use a cover rectangle that will cover the smaller header until it has to show up. On the smaller sticky header, you activate the "Fix position while scrolling" option on the right. This way the top header will scroll with the page, and the sticky header will show under it after you scroll.

I made an example in this thread for another user, you can check it out:

https://community.adobe.com/t5/adobe-xd/fixed-position-when-scrolling-until-a-certain-point/m-p/1146...

Hope that helps.

Cheers!

[babacar5CAA]

Thanks one more time Spas!

Your idea is the right one. I'll use it while maybe waiting for an update.

Thank you!

Cheers!