Skip to main content
Question

How to keep scrolling going while overlay is still displayed?


Vladimir

I have a feed view with vertical scrolling. One of the cards has a hover effect - displaying overlay (orange). My problem is that when the overlay is displayed the scrolling stops. To continue scrolling i need to move the mouse out, to hide the overlay and then I can continue.

I have tried playing with overlay settings but sounds like there is nothing Figma can do here to allow scrolling the main form while overlay is still displayed? The only way is to create a full copy of the whole page with that overlay present on it and preserve scrolling position while switching to it?

Cheersezgif-6-75bfc7195c95

10 replies

Gleb
  • Power Member
  • 4706 replies
  • January 27, 2021

Yep, it’s not possible at the moment. But you will soon be able to use Interactive Components instead of overlays so it will be possible. 🙂

twitter.com

Vladimir
  • Author
  • 4 replies
  • January 29, 2021

Okay for those who is looking for similar issues:

You can fix that by changing frame size of overlay to 1x1px (or just small) and disabling Clip content - then mouse hover will not count over the overlay, unless u hit that tiny 1x1 square, and content will still be displayed.


Gleb
  • Power Member
  • 4706 replies
  • January 29, 2021

Wow interesting workaround!


David_Crabtree

Make sure that you are not adding a background to your overlay also! This workaround does not work when you add a background behind the overlay


yoozer.io
  • 6 replies
  • February 15, 2022

I have the same question, for me the soltuion with the 1x1 px frame is not an option. @Gleb you said it will be possible soon. It’s a year now, any good news from the interactive component side?


Gleb
  • Power Member
  • 4706 replies
  • February 15, 2022

Interactive components have been released a long time ago.


yoozer.io
  • 6 replies
  • February 15, 2022

Thank you @Gleb, so the question for me still is: How can i keep scrolling, klicking and hovering my site, while an overlay is open. For now i can’t do anything when it is open…


Gleb
  • Power Member
  • 4706 replies
  • February 15, 2022

Don’t use overlays for that, use interactive components. Overlays block all interactions below them.


Laura_Di_Candia

This was a perfect solution for me! Thank you!


Amirhosein_Fahimi

WOOOOW! thank you veeeery much, I was struggling since morning. You helped me a lot


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings