Dear Greensock Community,
my task is simple and clear: I want to rotate a svg group <g id="rotationFrame>. I have written the following TweenMax to achieve this:
TweenMax.to("#rotationFrame", .5, {
rotation:rotationDeg,
transformOrigin:"50% 50%"
});
This does work quite good using safari. But as soon as I switch to Chrome the code does some crazy stuff:
Demo: https://vid.me/9EJU
How can I solve this?
To me it seems like Greensock is creating some wired css code, like
transform-origin: 0px 0px 0px;
transform: matrix(-0.86602, 0.49999, -0.49999, -0.86602, 957.167, 575.015);
As soon as I change this manually to something more straight forward, it does work in chrome:
transform-origin: 50% 50%
transform: rotate(90deg);