Skip to main content

Hi, not sure how to figure this one out. I have a circle that I want to expand on hover, but when I increase the size in the direction I want, it does not go in that direction.


I know it’s possible as I’ve seen similar stuff and it’s a pretty basic interaction, such as expanding circles for heart/favourite micro-interactions.


Prototype current example: https://www.figma.com/proto/yFy1wCYfhMkC3lxOjz0HNN/Untitled?page-id=0%3A1&node-id=5%3A36 - In this example, I want the circle to finish inside of the rectangle container with the image.


Any help would be appreciated 🙂

Simply by it’s position within it’s container/frame:


image


I hope this helps.


Not sure if this is closed, but I’m having the same problem.


I was trying to align both variants on the upper right corner, but it expands from the upper left corner every time


Hey guys, so i had the same problem and I’ve managed to fix it.

here is how


Its all about the bounding box!

Your animation direction is determined by your bounding box, to change your bounding box you hover over the resize lines than hold CTRL/CMND and drag out than you can hold shift for an even size.


after you’ve changed the compument bounding box you can change the actual size of the shape within the component. let me add some picture so you’ll see the reference



Please let me know if it helped and if you need more help 🙂


tysm you are a lifesaver!!


Reply