Skip to main content


  1. I want to make a prototype where something changes when user scrolls content.




  2. I want to keyboard collapse when user starts scrolling content, but it’s impossible to do with drag action. Or it feels unnatural




  3. Or am I missing a way to do it with existing tools?



+1 let’s do it!


This functionality is needed.


+1 on this! would be really helpful


+1 Would be great!


I would also really like to see this, please — have to switch to do this in Jitter to be able to hand over and can’t test it in usability testing!


Could the scroll event have an interaction like this?



  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, in this case I’m trying to make a sticky menu.




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




  1. I select the scroll event:




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



I cannot see that option. Can you please guide how to get the scroll option?


It probably was a concept / proposal what @Andres_Sanz posted.

This is not implemented yet as far as I’m aware of.


It’s an idea I’ve proposed, it’s not implemented nor are there any warnings that it will.

I’m honoured that my prototype confused you, that means it’s good enough to look like part of the app hahaha 🙂


+1 This feature would be very useful for prototyping!


yess!!! Figma it has been 2 years since this request…

Also we need a “on viewport scroll” to animate on scroll interactions. For example when a box enters the screen it should play a fade-in animation. Possible with every simple website builder but not with figma. Also for Video it would be great to let it play when on screen in preview.


XD doesn’t have this, Figma doesn’t have this - some niche prototyping tools do - but why should we have to double handle our work in 2 apps?


Hopefully when/if that $20bn from adobe hits the account this is getting implemented - It always feels like the missing piece of the puzzle and almost all our clients want to see this in prototypes.


+1 for enabling a button once Terms & Conditions have been read entirely.


Hey, just found a quick work around for OnScroll events (apologies if someone has already mentioned this.)



  1. I created a white rectangle that spanned the width of the screen.

  2. I moved it do the scroll depth I wanted to trigger the event.

  3. I selected the rectangle and used the “Mouse enter” interaction to trigger the next frame.

  4. I then hid the fill.


This has resulted in the interaction and behaviour I was after. Hopefully it works for some of you while we wait for Figma to create the actual OnScroll interaction 🙏


I’ve been wanting this for a few years now 😅 Glad I found this post to follow. 👍


Caleb, can you share some screenshots of your work? I’m very new to Figma and need some visual guidance. 😅


Sure @Annabelle ! Here’s a screenshot showing the rectangle (which I have hidden the fill on) and the prototype settings which lead to the next screen onMouseEnter.


For additional detail (given you said you’re new to Figma) this is what the rectangle layer should look like in the ‘Design’ panel. Note I have hidden the fill, but it can still be used for the purpose of prototyping.



+1 Need this feature badly. On Drag just can’t handle the detailed interaction desired. Thank you!


This is so needed! Please add the scrolling interaction feature!


2 years!!! We want this sooo badly, hear us Figma, please.


Maybe we will get it when Adobe finishes buying the software out. 🙄


Can you explain me how to do the hover hack? I didn’t success. Thanks


It’s exactly what I want to do, but I don’t know why it doesn’t work for me…


Oh, my god, is it finally available? I can not stop to thank you, Figma developers and team!


Figma

Thank you, thank you, thank you! Wow, I am so excited!!!


Reply