Scroll-to action in overlays

As written in the documentation (Prototype interactions and animations) the destination of a Scroll to action can only be an element of the same top-level frame. But with this limitation it is impossible to prototype a common navigation pattern.

On one-pagers there are often floating menu for intrapage links. E.g you have an hamburger icon that opens a menu overlay from where you can scroll to a specific page section. This can’t be realized with an Figma overlay because of the restrictions mentioned above.

There is a workaround, but it seems that it only works because of a bug: You can set the menu overlay as an child of the top-level frame of the one-pager, define the Scroll-to actions and then move the menu outside the frame (as an separate top-level layer) to show it later as an overlay. By doing this all the Scroll-to actions still work, but when you change an action the target will be rested and the navigation is broken.

Working Example

Maybe you can remove the restrictions that the destination of a Scroll-to action have to be on the same top-level frame for frames that are placed as an overlay.

6 Likes

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.