Highlighted

XD Hover state not working

New Here ,
Oct 03, 2020

Copy link to clipboard

Copied

Hey guys,

I'm currently prototyping an app and i've been creating hover state for buttons and most a working but there is a few that aren't working in play mode however in design they still say that the hover state is there, so I'm unsure why its not working or whats wrong?

Adobe Community Professional
Correct answer by Spas K. | Adobe Community Professional

Hi Rissel.

 

A few things to look out for when working with hover states:

1. Make sure all your components with hover states are set to the default state when you create / update the prototype. If they are set to the hover state, it is already "activated", so nothing will hapen when you hover the element.

2. When linking an element with a hover state to do something (transition to another artboard, scroll to, etc.), create the link while on the hover state of the component. The default and hover states can have different links. The default normally links to the hover state, and the hover links to whatever action you need it to do.

3. Nested hovers don't work yet. If you have a component with a hover state, and within that hover state you have another component with hover, the second level hover will not work.

 

Hopefully these tips will help you figure it out.

If not, upload the file somewhere and link it here, as Ares requested, so we can have a look.

Cheers!

 

Views

110

Likes

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

XD Hover state not working

New Here ,
Oct 03, 2020

Copy link to clipboard

Copied

Hey guys,

I'm currently prototyping an app and i've been creating hover state for buttons and most a working but there is a few that aren't working in play mode however in design they still say that the hover state is there, so I'm unsure why its not working or whats wrong?

Adobe Community Professional
Correct answer by Spas K. | Adobe Community Professional

Hi Rissel.

 

A few things to look out for when working with hover states:

1. Make sure all your components with hover states are set to the default state when you create / update the prototype. If they are set to the hover state, it is already "activated", so nothing will hapen when you hover the element.

2. When linking an element with a hover state to do something (transition to another artboard, scroll to, etc.), create the link while on the hover state of the component. The default and hover states can have different links. The default normally links to the hover state, and the hover links to whatever action you need it to do.

3. Nested hovers don't work yet. If you have a component with a hover state, and within that hover state you have another component with hover, the second level hover will not work.

 

Hopefully these tips will help you figure it out.

If not, upload the file somewhere and link it here, as Ares requested, so we can have a look.

Cheers!

 

Views

111

Likes

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
Oct 03, 2020 0
Adobe Community Professional ,
Oct 04, 2020

Copy link to clipboard

Copied

Can you share project file for review through any cloud service? Please check the structure of the objects in layers panel. May be you have some object that overload created "button" object?

Likes

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
Reply
Loading...
Oct 04, 2020 1
New Here ,
Oct 04, 2020

Copy link to clipboard

Copied

Heres a link to the prototype: https://xd.adobe.com/view/d1d4623b-9f57-4e58-818c-6ef5cbb2de82-8487/

 

The layers could be the problem as I'm pretty new to XD and not completely familiar with the right way to do everything haha

 

Thanks

Likes

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
Reply
Loading...
Oct 04, 2020 0
Adobe Employee ,
Oct 04, 2020

Copy link to clipboard

Copied

Hi there,

 

Thanks for sharing the link. In order to suggest the next course of action, we'll need access to the actual file and I'd also request you to share a small video capturing the workflow and what's exactly is happening, we'll try our best to help you with it.

 

I also found a helpful article related to component states, which you can refer here: https://helpx.adobe.com/xd/help/work-with-components-xd.html

 

Regards

Rishabh

Likes

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
Reply
Loading...
Oct 04, 2020 1
Adobe Community Professional ,
Oct 04, 2020

Copy link to clipboard

Copied

Hi Rissel.

 

A few things to look out for when working with hover states:

1. Make sure all your components with hover states are set to the default state when you create / update the prototype. If they are set to the hover state, it is already "activated", so nothing will hapen when you hover the element.

2. When linking an element with a hover state to do something (transition to another artboard, scroll to, etc.), create the link while on the hover state of the component. The default and hover states can have different links. The default normally links to the hover state, and the hover links to whatever action you need it to do.

3. Nested hovers don't work yet. If you have a component with a hover state, and within that hover state you have another component with hover, the second level hover will not work.

 

Hopefully these tips will help you figure it out.

If not, upload the file somewhere and link it here, as Ares requested, so we can have a look.

Cheers!

 

Likes

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
Reply
Loading...
Oct 04, 2020 1