Make an object appear on mouse hover

[ioana1103]

Hi!

I'd like to create an interactive infographic in Animete that makes a dialog box appear when the mouse is over certain reginos. I already created the infographic in Illustrator.

In this tutorial the first image has the effect I want to create: https://tomgermeau.com/2014/02/how-designers-can-create-interactive-prototypes-with-illustrator/

Can anyone help me out, please? 😄

Thanks,

joanna

[JoãoCésar · Accepted solution]

Hi.

This can be achieved using a regular button and with almost no code - only two stop instructions in the end of the hover animations. You only need a nested Movie Clip animation in the over state of a Button instance.

Preview:

http://bit.ly/2HIsFpx

FLA / source / files:

https://github.com/joao-cesar/adobe/tree/master/animate%20cc/html5_canvas/infographic_pop_up

Please let us know if you need further help.

Regards,

JC

[ioana1103]

Thanks so much for the reply! 

I'm new to Animate and I'm not sure I understood what to do. I opende the .fla file and tried to replicate the effect but I'm a bit lost 😞 Is there any chance for a step by step tutorial?

[JoãoCésar]

Hi again!

I can suggest you some help content to get you started. Please visit this thread for some useful links:
https://community.adobe.com/t5/animate/helpful-resources-courses-or-instruction-for-animate/m-p/1082...

Please let us know if you need further help.

Regards,

JC

[ioana1103]

Thanks so much! The files you shared were perfect and I could figure out from there what to do.

Best regards,

Joanna

[JoãoCésar]

Excellent, Joanna!

You're welcome!

[robertao56946245]

Hello Joanna,

JC has been able to redirect me to your thread but I am also struggling to understand how I use the files sent etc, which did you use to help you and were you able to sucessfully add a pop up box? I am completley new to Animate as well and seem lost as to where to start.

Many Thanks

Roberta