css3 - CSS animation rotating in unexpected way -


I think my junior high maths are failing me.

I want to rotate the two div s around the Y axis in different directions. I have made these two animations:

  @ - WebKit-keyframe first {0% {-webkit-transform: rotateY (0); } 100% {-webkit-transform: rotateY (-90 degrees); }} @ -WebKit-keyframe seconds {0% {-bbkit-transform: rotated Y (0);} 100% {-webkit-transform: rotated Y (90 degree); }}   

There is some confusion about my original Bela, so I updated it with an image. Each half of the two div will show the image. My idea is that every half image will rotate in opposite directions in the opposite direction of the y-axis unless they both disappear. It does not seem to be happening, they start moving together.

Here is Bela (Chrome only):

They are going in opposite directions

Add perspective to see it better

  .space {-webkit-affected: 1000px; }   



Comments

Popular posts from this blog

Verilog Error: output or inout port "Q" must be connected to a structural net expression -

jasper reports - How to center align barcode using jasperreports and barcode4j -

c# - ASP.NET MVC - Attaching an entity of type 'MODELNAME' failed because another entity of the same type already has the same primary key value -