Tweening left works, x does not

[garyw]

When I use this, the tween functions as expected:

 

    TweenMax.to('#myElement', 0.6, {left:400});

 

The following, however, has no effect:

 

    TweenMax.to('#myElement', 0.6, {transformOrigin:'left top', x:400});

 

This is true in Google Chrome and iPad Safari.  Any ideas?

 

[GreenSock]

That code works great for me - could you post a codepen or jsfiddle that clearly demonstrates the issue? Sometimes it's best to see it in context - maybe there's something else going on in your JS or CSS. Is anyone else having a similar problem? 

[Rodrigo]

Hi,

 

That's strange I just tested this in Chrome and works fine:

 

See the Pen 57b0425e65010dd8b1b1a50c3c9de064 by rhernando (@rhernando) on CodePen.

 

It would be very helpful if you fork it and change it to the scenario you have in order to get a better idea of what could be the issue.

 

Rodrigo.

[jamiejefferson]

Is it possible #myElement is display:inline (could just be a span, for instance) with position:relative (position:absolute would force block display and certainly work with transforms)?

 

Inline elements won't accept transforms at all, but positioned (i.e. not static, the default for all elements) elements with display:inline do allow left/top/etc adjustments.