Skip to main content
Question

"Scroll To" Interaction: Scroll to action, linking back to master component


Shawn_Willings

I have a master component, that has an auto layout applied to a list that uses the “scroll to” interaction. The list can be scrolled within the frame (mouse or drag). Clicking items within the list will center the item clicked based on the scroll to definition. All this works fine if I use the master component itself if I test the master component itself. The issue is that when I instantiate another component, the scrolling works but the “on click” items do not work and you can see that the on click links back to the master component items rather than the items within the instantiated component. See image below.

Master

Component

Not sure if this is an issue with how the scroll to works or whether it is the fact that the list items are within an auto layout or both. Has anyone else encountered this?

This topic has been closed for comments

7 replies

Gayani_S
Figmate
  • Community Support
  • 2033 replies
  • October 12, 2023

Hey there, are you able to send us a copy of your file so I can try to reproduce this?


I have the same problem. Since the “scroll to” interaction is supposed to scroll on the frame where it is clicked it would make sense that, when instancing the master component, the scroll to interactions would also be copied onto the instanced frame since a “scroll to” interaction mostly is used on the very same page it is deployed on.

Sometimes you have “scroll to” interactions that would load a different page and then scroll, but anchor link and destination is rather used on the same page.

Is there any progress on this issue?


Gayani_S
Figmate
  • Community Support
  • 2033 replies
  • March 25, 2024

Hey @Johannes_Hofmann, thank you for reaching out!

To get this troubleshooting process started, can you make us a short video? Please include the whole window, with the properties and layers panels in view and relevant layers expanded, and select any layers you’re having trouble with so we can check any relevant settings. We use these videos to try and reproduce the issue in our own files and so showing all steps needed to reproduce the behavior is helpful.

If possible please also share your file link here with support-share@figma.com invited directly as an editor (this won’t affect your billing at all). Also feel free to DM me the file link.

Thank you,
Gayani


Hey Gayani,

I can’t do neither of this, but I can add a Screenshot which is self-explanatory:

  • As you can see, there is a master component with 3 variants
  • Every variant has different content with an individual index which work as anchor links to the content below (Scroll to interaction)
  • When instancing the master component to the ‘Test Frame’ you can see that the anchor links link back to the master component

The links then don’t work in the prototype. This is most likely a minor bug which could be improved.

Kind
Johannes


Matt_Fouty

Same issue here. I have a web style guide that I created as a component and I wanted to use an instance of this style guide within a larger brand style guide (on a different page of the same document) but the scrolling interactions will not work because they seem to be connected to sections on the main component in a different page. The scrolling interactions work as intended on the main component on the other page.


Gayani_S
Figmate
  • Community Support
  • 2033 replies
  • April 5, 2024

Hey everyone, apologies for the delayed response!

Thank you for sharing a screenshot and explaining this in further detail.

I was able to reproduce this on my end. I’ve reached out to the teams internally. I will get back once I’ve received more information.

Appreciate your patience in the meantime!


Gayani_S
Figmate
  • Community Support
  • 2033 replies
  • April 8, 2024

I’ve got updates!

Our engineers have an open report for this issue in our backlog which I’ve added this Forum post to. As a long-standing issue not caused by any recent code changes it will likely take some time to be resolved and we apologise for the disruption in the interim. If this changes in the near future, and the engineers are able to release a fix more quickly than they expect, I’ll update you.

For now, I’d recommend applying any scroll to interactions in the frame itself, rather than in the component.

Thanks again for your help and for your patience while the team works to resolve this issue. Let me know if anyone has any follow up questions and I’ll be happy to assist.


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