Semi-static scroll animation in Mobile App Design

Question

Hey everyone,

I am trying to prototype an app that allows elements to scroll to a certain point and then remain at the top of the page for the rest of the scroll. There will be a default heading to my page that collapses into a miniature version with a few remaining elements after the users has scrolled a certain distance. How can this be done?

Thank you

Spas K. · Answer

Hi there. Xd doesn't support scroll triggers yet, but I made a small tutorial for this a little while ago, which shows a workaround / hack I've been using for such situations. Hope it helps.

Basically, you make a second version of the element you want to "stick", and put it behind a cover layer that scrolls with the page. At a certain point right under the scrolling element, that cover will reveal the fixed element and it will seem like it sticks to the top.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded