Search code examples
csssvggsap

Greensock Tweenlite transformations


I'm using tweenlite library to rotate, move and zoom image. The problem is, that I get 3D transformations on image, but I would like to have 2D transformations. If tweenlite detects that there is browser which doesn't support 3D, he will do 2d. How can I force him to always do 2D? It must be some setting. Or just disable 3D. (3d inside svg doesn't work in any IE browser)

This is ok:

transform="matrix(0.1082 0 0 0.1082 97 58)"

This is what I don't wont to have:

transform: matrix3d(0.1082, 0, 0, 0, 0, 0.1082, 0, 0, 0, 0, 1, 0, 53.5881, 48.8135, 0, 1);


Solution

  • I think what you are looking for is called force3D. Navigate to this link I shared and look for section named force3D on this page.

    Currently, force3D defaults to a value of auto which means it will automatically decide when to use transform3d and when not to.

    Also, there is a way to set it globally instead of appending it into every tween:

    CSSPlugin.defaultForce3D = false;
    

    Hope this helps.