If I use the folowing code through jQuery:
$('.logo').css('transform', 'scale('+ (maxvw / 1920) + ') translateX(36%) translateY(41%)');
The CSS is applyed and everything is ok. The logo is scaled on X and Y, and then image is positioned where I want.
Perhaps I need to set this through TweenMax for browser compatibility, since it translates to -all-browser prefixes, and even works on IE older versions. Then I'm using this:
TweenMax.set('.logo', {scale: (maxvw / 1920), x: '36%', y: '41%'});
The problem is that GSAP is converting "scale" property to "matrix", and the inline style is something like this:
transform: translate(36%, 41%) matrix(0.658854, 0, 0, 0.658854, 0, 0);
Look that property X and Y was correct setted, but matrix comes later, with 0 (zero) on X and Y and not position my element on 36% and 41% as I expected.
Why this happens? Which format should I use or it's a bug?