Highlighted

Hover effect on a button with auto-animate not working properly

Community Beginner ,
Oct 01, 2020

Copy link to clipboard

Copied

 

The hover effect is not auto-animated. It just switches between states instantly! What am I doing wrong? How to solve it?

 

Thanks in advance.

Adobe Community Professional
Correct answer by Kenneth Kawamoto | Adobe Community Professional

Auto-animate only works on certain properties:
https://helpx.adobe.com/uk/xd/kb/supported-auto-animate-features-in-xd.html

Fill colour and text colour are not supported. As a workaround, you can change the opacity of the button state to get the desired effect, for example.

TOPICS
How to, Prototyping

Views

105

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

Hover effect on a button with auto-animate not working properly

Community Beginner ,
Oct 01, 2020

Copy link to clipboard

Copied

 

The hover effect is not auto-animated. It just switches between states instantly! What am I doing wrong? How to solve it?

 

Thanks in advance.

Adobe Community Professional
Correct answer by Kenneth Kawamoto | Adobe Community Professional

Auto-animate only works on certain properties:
https://helpx.adobe.com/uk/xd/kb/supported-auto-animate-features-in-xd.html

Fill colour and text colour are not supported. As a workaround, you can change the opacity of the button state to get the desired effect, for example.

TOPICS
How to, Prototyping

Views

106

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 01, 2020 0
Community Beginner ,
Oct 01, 2020

Copy link to clipboard

Copied

Hey 

try t like that

You have 3 layers 

Text

Border

Fill Quare

 

t1.PNGt2.PNG

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 01, 2020 1
Community Beginner ,
Oct 01, 2020

Copy link to clipboard

Copied

Edit 

 

The Bottom Layer is where you change the oppacity in STandart state 0% in Hover 100 %

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 01, 2020 1
Community Beginner ,
Oct 01, 2020

Copy link to clipboard

Copied

Just did that and it worked! 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 01, 2020 0
Adobe Community Professional ,
Oct 01, 2020

Copy link to clipboard

Copied

Auto-animate only works on certain properties:
https://helpx.adobe.com/uk/xd/kb/supported-auto-animate-features-in-xd.html

Fill colour and text colour are not supported. As a workaround, you can change the opacity of the button state to get the desired effect, for example.

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 01, 2020 2
Community Beginner ,
Oct 01, 2020

Copy link to clipboard

Copied

Thanks Kenneth! It worked.

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 01, 2020 0