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

What is Framer? Join the Community
Return to index
Ben Rodenhäuser
Posted Jan 08 - Read on Facebook

I think this question has been discussed before, but I could not find an answer to it:

I have a layerA which is masked by another (parent) layerB. Now I would like to scale layerB in such a way as to reveal more of layerA, i.e., I want to be able to scale layerB *without scaling layerA*. This seems to be a bit of a problem because layerA is a child of layerB (otherwise, no masking would be possible ...), so the default behaviour is that layerA scales along with layerB.

Any suggestions? Thanks in advance!!

5 Comments

Jorn van Dijk

If you use scale, then yes that is how it should work. But you can animate the width and height of the parent layer instead. Here's an example: http://share.framerjs.com/bq8nxy57jkjd/

Ben Rodenhäuser

Thanks, that certainly helps. What I would like to do is have the parent layer grow from the center outwards, equally in all four directions. If I were to use scale, I would know how to achieve this (using originX and originY) – is there something similar for animating width/height?

Jorn van Dijk

Totally possible :) Give it a shot, and if you can't figure it out, let me know.

Ben Rodenhäuser

Well, I have something which sort of works: listening for changes to the size of the parent object and recentering both the parent and the child as soon as such changes occur (mask.on "change:size", -> mask.center(), child.center()). This leads to a somewhat "wiggly" animation, though. I could not figure out how to "truly" fix the position of the child. Any further clues? ;-) Thanks a lot for the help, in any case! Much appreciated.

Marc Krenn

http://share.framerjs.com/57fopaapwow5/

pixelAlign() should fix this problem but it doesn't seem to work.

Read the entire post on Facebook