Interaction on hover state not working

Ask the community
1

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

2

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

3

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

Screenshot 2023-06-09 104423
Screenshot 2023-06-09 1044231851×239 12.2 KB

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

4

I updated your file here:

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 :slight_smile:
Hope it solves your problem
Enjoy

1 Like
5

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

1 Like
6

I see
The way you want to do it does not work :slightly_smiling_face:
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

7

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?

8

You just need 2 variants with select open and closed normally

9

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?

10

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 ?

11

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:

image
image1630×646 16.8 KB

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

12

Hi Stephan, last question, I promise :sweat_smile:

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

13

Sorry @Alberto9 did not see your message.
Do you still need help on sthg?

14

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?

15

You can copy paste interactions easily

Check this: