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

What is Framer? Join the Community
Return to index
Jason Nelson
Posted Jun 20 - Read on Facebook

I'm having an issue with 3D rotations conflicting with parent container layers. I have a (very hacky) 3D carousel that is invisible if I make the parent layer visible. Essentially the Z coordinates of the carousel all fall behind the parent layer. My question is, is there a way to mask this 3D space in a container such that I don't have to worry about the Z coordinates of everything else in my prototype?

See this example:

http://share.framerjs.com/onme4svvpmfx/

You'll just see a black box. Make it transparent to see the actual 3D carousel. What I'd like is for the carousel to live within the parent layer without having to worry about the parent layer's Z coordinates. Is this possible?

TIA!

4 Comments

Koen Bok

I'm afraid not. If you start using 3d, z coordinates start to play a big role. There are tricks where you only apply 3d/perspective in a specific layer instead of to the entire prototype. Jonas knows more about this.

Jonas Treub

You can solve this by creating a parent layer that has clip set to true. When a layer clips it turns of the global perspective. By setting perspective on the clipping parent you now have local perspective which is great if you want a certain object to look the same no matter where you place it on the screen. For example a 3D date picker like on iOS. Here is an example: http://share.framerjs.com/5x8c3ccr4ibe/

Jonas Treub
Jason Nelson

Thanks, Koen and Jonas! I will give this a try!

Read the entire post on Facebook