Forum Discussion
Make Object Shrink on Hover
I am trying to animate objects to shrink when I hover over them and then grow back when I hover out. I can do hover states, but I cannot animate them that direction, I can only grow when hovering over and shrink when hovering out.
Context: I am creating a training module for health care to show to to check pupils with a pen light.
Here is a quick mock-up as an example: https://360.articulate.com/review/content/169c17d0-dce5-44ea-b27b-b42b92765b78/review
Thanks for any help you can give.
7 Replies
David,
Here is a quick mock up of one way to approach this. Hope that helps you!
Richard
You beat me to it Richard - I was mocking up this same solution but had to jump on a work call. Nicely done.
Thanks Owen!
Here's another take on this problem using a slider and state changes.
https://bridgehillls.com/making-objects-shrink-on-hover-the-pupil-project/
Richard
Amazing, thanks! I will adapt to show binocularly (which is important in my setting, ophthalmology)
Also, love the blog post.
You are welcome David.
Hi all,
Here is my approach with animated hover states. It takes two triggers and two oval shapes with additional animated shapes inside the hover state.
https://360.articulate.com/review/content/45ea11c7-6971-4428-b0f9-f9fc7fefef28/review
