• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Hover effect cancels other (tap)triggers

New Here ,
Sep 29, 2020 Sep 29, 2020

Copy link to clipboard

Copied

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!

TOPICS
Prototyping

Views

1.7K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Sep 29, 2020 Sep 29, 2020

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 🙂

Votes

Translate

Translate
Community Expert ,
Sep 29, 2020 Sep 29, 2020

Copy link to clipboard

Copied

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 🙂

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Sep 29, 2020 Sep 29, 2020

Copy link to clipboard

Copied

Thanks! Works like a charm now!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Oct 16, 2020 Oct 16, 2020

Copy link to clipboard

Copied

LATEST

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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines