Skip to main content
Matthias_Kampitsch
New Participant
January 14, 2026
Question

Links breaking when switching variants (Mobile Navbar)

  • January 14, 2026
  • 19 replies
  • 201 views

Hi everyone, I’m running into an issue with a mobile navbar component.

The component has two variants: Default (hamburger icon) and Open (with menu links).

  1. On my mobile frame, I set the variant to "Open" so I can select the links and add "Scroll to" interactions to specific anchors on the page.
  2. If I leave the component in the "Open" state and preview, the links work perfectly, but the menu is obviously open as soon as the page loads.
  3. If I change the component back to "Default" so the user has to click to open it, the "Scroll to" links I set up no longer work once the menu opens in the prototype.

It seems like the variant switch is "wiping" my instance overrides for the links. Is there a way to keep these specific scroll interactions while still using the variant toggle?

19 replies

Aaron_Johnson
New Member
February 5, 2026

I’m in the same situation.

I simply want to connect my “Open” mobile menu to anchors on the page. I feel like there’s a weird way around this in normal Figma, but on Sites, I cannot drag a variant of either menu component into the “Home” web page section in order to even try these workarounds out.

Since I cannot duplicate a variant of my menu component, all I have to work with is the master component which only allows me to connect to sections within my Styles outside the bounds of my web page section.

I’d like an explanation for this, as it alone would be sufficient to deter me from using Figma Sites for basic mobile menu interactions.

GoLYone
New Member
February 10, 2026

I’m seeing the exact same issue.

Anchor / scroll links break as soon as the mobile menu is opened via a variant switch.
If the menu starts in the Open state, links work - but once there’s a double on-click (variant toggle + link), the anchor gets wiped 😵

Feels like anchor links don’t survive variant switching in Figma Sites.

Gaspard Silvestre
New Member
June 23, 2026

Same issue for me. Does anyone found the solution? I”ll try to code it with Claude to see if I have better results. 

Jaycee Lewis
Figmate
Figmate
June 23, 2026

Hey hey ​@Gaspard Silvestre  (and ​@Aaron_Johnson ​@GoLYone ​@Matthias_Kampitsch 😊) I’d love to dig in a bit more with you.

I have a few questions:

  • When the link fails after opening the menu via the Default > Open toggle, does it do nothing, jump to the top, or scroll to the wrong section?
  • Is the Scroll-to interaction set on the link inside the Open variant of the component, or on the link element at the page/frame level?
  • Are you seeing this in a published Sites URL or in preview — and is the navbar sticky/fixed when open?
  • Are all the target sections on the same page as the menu, or are any on a subpage? 

Thanks for the additional information! — Jaycee

GoLYone
New Member
June 24, 2026

Hey ​@Jaycee Lewis 

Thanks for looking into this 🙂

To be honest, I don't remember all the details anymore as this happened a while ago, but I could probably recreate it if needed.

From what I remember:

  • The navbar was a fixed/sticky hamburger menu at the top of the page.
  • The links were anchor links pointing to sections on the same page.
  • As soon as the menu was opened via a variant switch (Default → Open), the anchor links stopped working.
  • Nothing happened when clicking them - no scroll, no jump to the wrong section.
  • If the component started in the Open state, the links worked correctly.

That's why my assumption at the time was that the anchor/scroll interaction was somehow getting lost after the variant switch.

If it's still useful, I can try to recreate the setup and provide a fresh test case.

Thanks! 🙌

Gaspard Silvestre
New Member
June 24, 2026

Hey ​@Jaycee Lewis thank you for your answer

I’m currently still on it.
For my issue, there are my points:

  • When the link fails after opening the menu via the Default > Open toggle, does it do nothing, jump to the top, or scroll to the wrong section.The link only performs one of the two actions. It either closes the menu and returns it to its default state (Open → Default) using the Change to interaction, or it scrolls to the target section using the Scroll to interaction. However, when I add both interactions simultaneously so that it scrolls to the desired section and then closes the menu by returning it to its default state, it no longer works. The bug only occurs when both interactions are applied together.
     
  • Is the Scroll-to interaction set on the link inside the Open variant of the component, or on the link element at the page/frame level In my specific case, the Scroll to interaction targets a section/frame on the Landing Page.
     
  • Are you seeing this in a published Sites URL or in preview — and is the navbar sticky/fixed when open? The issue is visible in Preview mode, and the Navbar is set to Fixed.
     
  • Are all the target sections on the same page as the menu, or are any on a subpage? The targeted sections are located on the same page as the menu, within the Landing Page.

Don’t hesitate to ask if you have more questions. 

Thanks!

G.

 

Gaspard Silvestre
New Member
June 24, 2026

yes ​@Graoumia, thank you for your response. 

Do you have recommandation to avoid that? 

G.

 

Jaycee Lewis
Figmate
Figmate
June 25, 2026

Hey hey ​@Gaspard Silvestre 😎 Thank you very much. I have a few more clarifying questions if you have a sec:

  • When both actions are on the click, what's the order in the panel — Scroll to first then Change to, or the reverse? And does flipping the order change anything?
  • If you set the Change to a slight delay (or set its animation to Instant rather than Smart animate), does the Scroll to start firing? (Asking because the Change-to variant swap re-renders the menu and can cancel the scroll mid-action — Instant has resolved similar scroll+variant conflicts before.)
  • When both are applied and it fails, which action wins — does it close the menu and skip the scroll, scroll and skip the close, or neither?

If I open a support ticket for us, could you share the file with support-share@figma.com (View access) plus a short screen recording of the click with both interactions attached?

Thanks! — Jaycee

Gaspard Silvestre
New Member
June 26, 2026

Hey ​@Jaycee Lewis thank you for you response.

 

  • When both actions are on the click, what's the order in the panel — Scroll to first then Change to, or the reverse? And does flipping the order change anything? Flipping the order changes nothing in this case, I already tried it several times, only Change to aplied.
  • When both actions are on the click, what's the order in the panel — Scroll to first then Change to, or the reverse? And does flipping the order change anything? I didn’t try this yet. I will try today, good idea. 
     
  • When both are applied and it fails, which action wins — does it close the menu and skip the scroll, scroll and skip the close, or neither? Change to wins each times. It closes the menu and skip the scroll. If I delete Change to, the links work and scroll to the targeted sections


    Another weird thing is that these links only work if I switch my Menu Default component to Menu Expanded.

    If I keep Menu Default as the default component and click Preview, the burger button correctly opens and closes the navigation, but the links don’t work.

    If I switch the default component to Menu Expanded and click Preview, the links work, but the Change To interaction doesn’t. As a result, the menu stays open while the page scrolls. It works, but it’s not an ideal mobile UX. 🙂

Here is the link to access to my Figma File

Again, thank you for your time!

Jaycee Lewis
Figmate
Figmate
June 26, 2026

Hey ​@Gaspard Silvestre to confirm, you can provide a screen recording, not zoomed in, showing the right sidebar and the issue(s) occurring? Support will need this for any ticket we open. You don’t have to share here, just confirm you can share in a ticket I create for us. Thanks! — Jaycee