Links breaking when switching variants (Mobile Navbar)

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.

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.

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

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

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! 🙌

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.

yes ​@Graoumia, thank you for your response. 

Do you have recommandation to avoid that? 

G.

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

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!

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 

Hey ​@Jaycee Lewis , took me some time to check, but here are my findings:

1) It does almost nothing - it only switches to the hover variant of the link. But in terms of page scroll/jump nothing happens.
2) On the link element at the page/frame level
3) Yes, on a live site. Yes, navbar is sticky/fixed when open
4) on the same page 

Thank you for your time!

Hey ​@Matthias_Kampitsch I've opened a support ticket for this: ID 1993241 — Figma Sites: Scroll to interaction canceled by Change to on mobile navbar link.

There are a few requests in there for you when you get a chance:

• Share your Figma file with support-share@figma.com (View access is fine)
• Send a short screen recording (not zoomed in) showing the click and the navbar behavior, ideally with the right sidebar visible

Thanks again! — Jaycee

A question for all if you have a sec — ​@Aaron_Johnson  ​@GoLYone  ​@Gaspard Silvestre  ​@Matthias_Kampitsch 

• When you set Change to's animation to Instant instead of Smart animate, does Scroll to start firing?
• When both interactions are on the click, which one wins — does it always close the menu and skip the scroll, or does that flip depending on order?

Appreciate you all being so thorough on this — Jaycee

​@Jaycee Lewis 

• I’m not sure how or where I could set the to’s animation in Figma Sites? I can only set “Anchor link”, Destination and Offset.

• When I add a click interaction to change to “default” (closed), also the hover interaction doesn’t work anymore.

I also just sent the view access and screen recording to support-share@figma.com

Thank you!

​@Jaycee Lewis ok, looks like I can’t send an e-mail to this google group. So here is the screen recording: https://drive.google.com/file/d/1CHbGpunSgGLNUuge__pO58HiE0m3wIvK/view?usp=sharing

Thanks :)

Hey ​@Matthias_Kampitsch 👋 Can you reply to the support email and attach that link, please? The subject line is Figma Sites: Scroll to interaction canceled by Change to on mobile navbar link and the ID is 1993241. If you don’t see it in your inbox, you may need to search your spam folder for it.

It’s already assigned to our Technical Quality team and adding your updated info, screenshots and recording are the best next step. Plus keeping the communications in te support ticket prevents details from getting lost as TQ doesn’t work from the forum. Thanks! – Jaycee