This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Justin Kwong
Posted Oct 25 - Read on Facebook

New to framer (and love it so far!). I'm trying to do a simple animation where the user clicks on a 'favorite' icon and the icon changes color (to mark that it is favorited). During the animation the icon expands in size before shrinking.

Does anyone have any advice on how to achieve this or similar projects that i can take a look at? Would really appreciate it! Attached a really short video to illustrate the animation i'm trying to recreate. Thanks!

6 Comments

Jonas Treub

Probably something like this: http://share.framerjs.com/v4kp1g2kiifi/

Justin Kwong

Jonas Yes - exactly what i was looking for. thanks!

Giovanni Caruso

Jonas was fast as light : ) My version: http://share.framerjs.com/g85y0sjiiqw7/ (I've commented out a solution based on touch events if you want to give it a try)

Justin Kwong

Giovanni Thanks! I'll check this out as well. I'm working with existing image assets for the icon

Justin Kwong

If i have two separate layers, would i just be changing the opacity of both layers upon click?

Giovanni Caruso

yes...or you could just change the image associated with the layer, i.e. layer.image = "url1" to layer.image = "url2". Url could be a link (if the pics are hosted online) or a local path (images/filename.png) if you have already imported the images into framer.

Read the entire post on Facebook