Skip to main content

i searched the forum but i can’t find a solution. My question is if it be allow to use interaction on prototype to change frame by click on an hover state in an instance of a component nested in another component. I couldn’t do it and couldn’t find any solutions. Can you help me?


i need to create a menu (like the angular material one), i can click on the icon to open the menu and i can hover the first item to see the effect, but if i set an interaction to change frames it doesn’t work.


I link a test file, maybe it explain better my idea


Figma – 7 Jun 23

I would create a bigger component containing your button and the menu


And add a variant where the menu is opened or close


And it should work


Hi Stephane, thanks for your reply! Maybe i wasn’t clear enough. I already have a component like this.


but when i use an istance of it i can’t click the hover state to change frames. I set the interaction, but in prototype mode it doesn’t work


I updated your file here:


Figma – 9 Jun 23

Here a video result





When adding interaction between variants, sometimes it does not work from the right side panel.

But it works if you use the white handle in prototype mode.

I don’t know why 🙂

Hope it solves your problem

Enjoy


Excuse me Stephane, this is what i meant. I hope this way is clear 😀





I see

The way you want to do it does not work 🙂

This is why I did it that way up


Tell me if you find a better work away


With what I did you can link to the red one on click too


ok, I saw your solution, but to do this I need to have a component for each menu I need, correct?

Because if i had to link the component to a frame, if i need 2 o plus menu I can’t have a single instance with several interaction. is my think correct?


You just need 2 variants with select open and closed normally


ok, but if i need to use that component in 2 different part of the file which had to link to different frames?


could it be because i have the main component in another page of the file?


There are thousands of use cases…

In some you’ll need to duplicate your component states every times


What’s your use case ?

Are you building a library with a menu Button ?

Should the menu redirect to pages only ?


my need is to create a menu i could reuse in different frames, and when I open it i have to can link a voice to another frame. For example i have to create frames like this:



where, potentially, every item on the menu links to another frame. And i need to replicate this behaviour for several table around the prototype.


Yes, i have a file with 2 pages: one for the product and another for all component i need, and the component is shared to all file i create.


And yes, every voice links to another page


Hi Stephan, last question, I promise 😅

Figma – 15 May 23

can you check my project and confirm i need to use component like this? It’s a bit elaborate but at least it work


Sorry @Alberto9 did not see your message.

Do you still need help on sthg?


Hi Stephane, no problem. I have only a question. There’s a way to move component in another page but keep the interaction? Or to use interaction I need to keep all component in the same page?


You can copy paste interactions easily


Check this:



Reply