LAUNCHED: Elements now stick to the top when vertically scrolling in prototyping

You can pretty much achieve this by putting your element with fix positioning in a new frame that allows vertical scroll. Then you have 2 scroll areas. That allows you to show off and explain the effect. It worked for me.

Hey @stelios can you please explain this a bit further?

I think I found a good solution to your problem, but not sure if I understood your use case well.
Basically you can create a frame with auto layout, in it 3 frames:

• header: fixed height
• content:
  • fill container
  • but the content in it does not scale, takes as much space as it needs.
  • Check “Clip content”
  • in Prototype mode set “Vertical scrolling”
• footer: fixed height

See my example file:

+1 - I used Aninix to solve the explained issue but the result - as great as it is - is a video.
The way Aninix lets you animate the elements on the page is how I know it from Principle. What’s missing there is a chance to link between elements/frames.

Come on Figmadobe!!

PLEASE ADD THIS.

This is so essential to prototype demos with sticky side navs and scrolling content. I need a left right expand collapse of a side nav while it also staying in place vertically and being able to scroll the content. You would not believe how may stakeholders have asked “is it going to actually do that?” when it doesn’t stay in place when I do my demos.

Could we have an update on this?

Yes! This would be super useful in many cases. Here’s another way someone could use this: RCA Programme finder. I think there’s no way to do this now…
There should be a way to assign where the fixed position would start and where it would stop in a specific frame.

Hey @Gleb Your solution sounds perfect! Can you please share a file in which the prototype works? I can’t figure out exactly how you solved this. Tried some settings but it doesn’t work for me. Thank you!

Gonna clarify again: this is not a solution, this is a suggestion of how things might work in Figma if they implement this feature. My prototype doesn’t function. It’s just an animated demo of the suggestion. There is no way to do a functional prototype like this in Figma currently.

@Gleb thank you for your answer. Ah ok understood! 🙂 Would be great this way!

Do you think this problem could be solved with a scroll event?

1. I select a frame and take the link to another frame. I make sure the distance of the element I want to keep on the ceiling.

2. I deploy the event selector and choose the new scroll event:

3. I select the scroll event:

4. I specify the event at which pixel of the total height I want the event to be triggered:

I migrated my design from Xd into Figma… only to find a function that I was able to do on Xd SO easily, and I cannot recreate it on Figma. 🤦‍♀️

+1 vote

let’s make it!

looking forward to this addition, it’s such an important feature to so many implementations these days!

I need this feature also, thanks

That’s why competition is so much needed in this industry.
Figma has the biggest market share so Figma folks don’t have the pressure to catch up to a competitor and this basically means they do not improve their features as quickly as we would like them to.
Many core features have flaws and features like this don’t exist yet despite being already implemented in competitors tools.
If Figma really wants people to switch to them they should reconsider the importance of improving on things their competitors may do better.

we want this plssssss

+1, our design team could really use this!

Figma team, please please please add this feature!

Yes ! Would love this feature @Figma_Support ! Let us know if you are working on it 🙂

The answer is NO, if you haven’t got the hint yet, peeps!

No way they need to add this feature real quick or i start developing on Adobe XD

I have found that communicating concepts to upper management is becoming increasingly difficult without this feature. Especially as more and more companies adopt such function.

typical figma user journey:

• client requires a prototype that can demo basic functionality of a webpage
• client requests prototype in figma
• i end up on a forum page where users have been requesting the feature for several years

Where is this in the list of priorities?