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

What is Framer? Join the Community
Return to index
Jacky Lee
Posted Jun 30 - Read on Facebook

Question: I got a prototype here:
http://share.framerjs.com/umdt5fqzqe0c/

It performs fine on Safari but really buggy on Chrome. Specifically around layer index or z-index. Has anyone ever came across this issue?

2 Comments

Balraj Chana

Hey Jacky, there's 2 things going on here:

Firstly, you can't animate the shadowColor property as it holds a string value. You can only animate numeric properties shown here: http://framerjs.com/docs/#animation.animation. This is what's creating the 'jump' between different states. However there is a workaround using CSS transitions.

Secondly, you need to set the index before the animation starts and not during it. Even though you can animate the index property, it will cause the blocks to jump in and out and overlay each other.

When you click on a block, the index is set to 1 and all the other blocks are set to 0: http://share.framerjs.com/yshw4oyn9z6h/

Jacky Lee

Thanks for the thorough comments Balraj Chana!

Read the entire post on Facebook