Hover effect cancels other (tap)triggers

Question

Hi! While UX designing a website, I bumped into a problem: I want some circles to have a hover-effect so the user knows it's a button. Then, when the user taps the circle, I want them to go to another artboard. For some reason, when I added the hover-effect, the tap-trigger won't work anymore. I tried deleting the hover-effect, this results in the tap-trigger working again. But after adding the hover-effect again, the tap-trigger stopped working... again...

Is there someone with experience with this kind of problem and with a solution?

Please let me know! Thanks!

Spas K. · Accepted Answer

You have to add the tap interaction to the hover state of the component, instead of a secondary interaction of the default state. When you go to the prototype tab, switch to the hover state of the circle and then make the connection.

Otherwise, when the hover animation is over, it essentially swaps the state with another, which doesn't have an interaction on it.

Hope that helps 🙂

spaceinteractive · Answer

Hi. One other question for this topic. I can't combine the hoverstate with a tab state? So for example. My issue is, that everytime i create a hover state and i want to tab/click it, it is only clickable after the hover animation ends? So what if i want to tab/click faster on the button? Often someone tries to click the button - but he can't because its in hover-state and he has to click another time.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded