precedence for translate and transform css?
Is there a way to set precedence for translate and transform css calls on an element?
For example, in my pen if I set:
TweenMax.set( '#a', {
y: '-50%',
scale: 2
});
It results in this css:
translate(0%, -50%) matrix(2, 0, 0, 2, 0, 0)
How would I use greensock to get this result instead:
matrix(2, 0, 0, 2, 0, 0) translate(0%, -50%)
The latter results in a different position of the element.
See the Pen Ejyqxj by jedierikb (@jedierikb) on CodePen
We very purposefully designed GSAP to always apply transforms in a specific order in order to make things predictable and very stable. With most other animation systems, the order-of-operation thing causes all sorts of problems. Imagine, for example, that you animate the x/y translation with one tween that happens to run first...and then a different tween runs that affects rotation (and it may even start on the same frame, but just barely after the other one) - you get completely different resul
