Element on page scroll with page and then become fixed?


Is it possible to make an element on the page scroll the page for a certain distance and then that element becomes fixed while still being able to scroll the page further?

I currently don’t see how this can be done with interactions…thoughts?




At the moment, in order to do this, you need 2 instances of the same element (like 2 instances of the same symbol). One being fixed and hidden, the other normla and shown. With an intraction, inverse the show/hidden properties when elements overlap. When well done, it’s unoticeable.

1 Like

Awesome! Glad something will work but hoping they fix this sooner than later…doesn’t feel like the most ideal, especially it when comes to duplicate content relative to seo.

Thank you @vincent


Hi @vincent it appears this won’t work for me. If my site was left aligned instead of center aligned, it would do the trick for sure.

Thank your for taking the time though.



Hello @nathanphilsteele

If helps in some way, here is one example of what @vincent is saying, I create a sticky nav bar for this project.



Hi @aaronocampo,

I know exactly what he and you are saying…I tried it with left column navigation. It stays fixed on both the x and y axis when I need it to stay fixed on the y axis but flex with all the other elements on the x axis…stay in it’s swim lane so to speak, which is why if my site was left aligned and the left side didn’t flex with the change in screen width size, it would be a perfect solution.

I really appreciate you help…but I have another problem you may be able to give me some advice on Help with overflow while using 1280 breakpoint



This topic was automatically closed after 60 days. New replies are no longer allowed.