Hi, how would you animate a layer in a perspective? Something similar like in this example: http://lab.aqro.be/fb_btn_concept.html. Thanks for the help!
If the thickness of the FaceBook-flap is important to you, youshould probably look into a fully fledged 3D engine like http://threejs.org/
If a paperthin-flap is acceptable for you as well, try something like this:
flap = new layer originY:0 # 0-1 sets the rotation axis to the top or bottom of the layer
flap.on Events.TouchStart, ->_____flap.animate__________properties:_______________rotateX: 45__________curve: "spring(500,12,0)"
Hi, thanks for the answer. I have tried you code, but it seems that it doesn`t work properly. Am I doing something wrong? http://share.framerjs.com/binxw46lq53a/
"rotateX: 45" should be "rotationX: 45". Sorry.
Now it changes only its height: http://share.framerjs.com/praczd4oo4y7/. It`s not animated in the perspective. Again, thanks for the answer.
You need to set perspective on the layer itself or the superlayer.new Layer perspective: 800 rotationX: 30
Perspective set on the layer itself doesn't seem to work.
Does anybody know how to change image position inside an layer?
You are right Marc. The perspective needs to be set on the superLayer. You probably want to set clip to false on this superLayer so the rotated layer will be fully visible.
@Jordano, create a new (smaller) "imagelayer", change its image to your liking (image = "link") and make it a sublayer of the (bigger) "containerlayer" (imagelayer.superLayer = containerlayer)
After that, you can center the imagelayer with imagelayer.center() and/or move it around manually with imagelayer.x and imagelayer.y
You are right, thanks man. I have to say that framerjs is awesome.