Allow Hover AND Click together

Im starting to lose my confidence in Figma… stuff like this, a simple prototype action, that gets blocked by a hover state… prototyping over multiple pages… all such basic functionality… and there are 0 moderators here that can give us some clarification, about how the roadmap is looking, and where these features will be on the roadmap. And im not the only UX’er thinking this. Terrible support of Figma.

3 Likes

Please please resolve this.
It’s a must for web prototyping.

The workarounds are breaking stuff, adding extra clutter & not aligned to code.
I think this should be a native supported feature.

4 Likes

Another kind reminder about the well-intended “workarounds” by designers: please stop. We want an actual, supported and non-janky solution for a super common behaviour.

When designers give each other “hacks”, they give Figma a reason to deprioritise fixes.
Please stop.

4 Likes

I don’t know why this simple scenario still not be resolve yet, it’s really annoying. I just want to quick make a prototype, but I spent more extra time to figure out how to make a element having click and hover interaction

5 Likes

This is the best solution for this issue. There is no reason to to don’t give 1000000 heart!

3 years have been lost

I hope Figma folks prioritize this. it feels one of those foundational must haves.
I have had a lot of headaches as well when changing component variant on click using variables and combining that with hover.

Example: accordion-like table that needs to show details variant when clicked but it needs a hover. I had to ultimately remove the hover from design and add it as a written requirement…

I’ve been trying to solve this off and on for WEEKS. I have a component header that has a hover state, and in that hover state there actions buttons (which have hover states because this the whole point of variants and applying interactions). I cannot get those action buttons to do anything when clicked (or pressed or downed on…) because they only show in a hover variant…that seems to render click or certain mouse actions useless.

I’ve wasted so much time trying to figure out what I’m doing wrong. I assumed it was a bug or something I have been mixing up. But Figma LETS YOU make these prototyping selections. IF THEY’RE NOT GOING TO ALLOW THEM THEN DON’T LET ME MAKE THOSE SELECTIONS!

Really appreciate all the people contributing to this thread. Thank you all for helping me realize I’m not crazy.

1 Like

Hi Guys! I figured out a solution that worked for my project. Don’t know if it will work for more complex situations but just wanna share it in case anyone need it!

I guess the main reason that “hover” and “click” are not mutually exclusive is because when hovering, you’re essentially opening up an overlay, while the “on click” interaction is attached to the original item.

My solution is the following:

  1. make the original button (let’s call it A)
  2. duplicate one and make the hover button (let’s call it B)
  3. in prototype mode, connect A to B with hover interaction & open overlay
  4. add click interaction to B

This way, the hover effect will show when hovering to A, and the click interaction will happen since you’re essentially clicking on B, the overlay.

3 Likes

Your monthly reminder to designers to stop providing hacky workarounds in a misguided attempt to help

What we want is for Figma to provide a native, intuitive and supported solution.

What we don’t want is for them to go "Oh, looks like they can do it with immense frustration and difficulty, oh well, bottom of the backlog this goes

STAAAAAHHHHHP

4 Likes

Figma! Please implement this! It should not be easier to code a UI element that has both hover and click interactions than it is to build one in Figma. I design for audiences with highly variable levels of technology savvy — it is essential for me to be able to test discoverability with hover interactions and usability with click interactions.

4 Likes

So…a solution I found for this issue (someone may have already done this but this is what I’ve learned) is if you’re working with variants, you can have your default variant, such as for a button that is currently “Off”, change to a hover-over variant with the hover over interaction in prototype. Then, use the click interaction on the hover-over variant to switch to your other default button variant, one that is “On.” The click and hover-over interactions can’t function together on the same variant, but if you move the click interaction to a hover-over variant then it should create the same effect.

I’m not sure if this addresses anyone’s specific issue but hopefully this is helpful to somebody.

1 Like

back again prayin for this

My “hack” to have a tooltip on an icon button plus a click event on the button was:

  1. Icon button includes a hover event linked to a frame which holds my tooltip component
  2. Frame of the tooltip component is oversized, to overlap with the button underneath
  3. Frame of the tooltip component is transparent
  4. Frame of the tooltip component has a click event to the target screen

Simple :slight_smile: Though I really with Figma would allow this functionality

IT IS 2024. How is LITERALLY the most basic interaction IMPOSSIBLE to prototype in Figma TO THIS DATE without a ton of finagling and insane out of the box thinking to get to work?

Stop spending money and time on BS AI and whatever else design-adjacent ideas and focus on improving basic functionality for actual designers (you know, the people primarily using your product)

3 Likes

@Denise_Edwards Maybe we can ask the AI control to make us a prototype action that has hover and click

3 Likes

I forgot to mention this to the user researchers at Config 24. I don’t care about the AI stuff. Please fix this. After the Config fever wore off, this is what I’m dealing with on my day-to-day work and I’m ready to rip my hair out…with these workarounds…

4 Likes

THEY DID! I miss Adobe XD so much…

I’m going to try it out…

Preach. Figma’s roadmap smacks of CEO brainfarts rather than actual user needs.

1 Like