rotation:180 does not work twice

[MaorF]

Hey,

I seem to have an issue with tween lite rotation. when applying rotation:180 to a div.

The tween works once. after resetting the css of the div I apply rotation:180 it does nothing...

 

It seems the transform matrix isn't cleared.

This only happen only steps of 180, 360... anything else works fine.

 

 TweenLite.to($("#image1'), 5, {rotaion:180,  parseTransform: true, clearProps: "transform" });

 

Thank's in advance

[Rodrigo]

Hi,

 

You have a syntax error in your code, the property being cleared must be the same one being animated, so it should be clearProps:"rotation".

 

And yes for some reason, that unfortunately I don't know, the clear props call resets the element's in-line style, but the transform values of the _gsTransform object aren't reseted, so if the element is animated again the rotation doesn't animate even if the element is rendered in it's original angle.

 

Until an official explanation comes up what you could do is create a onComplete callback that sets the element's rotation back to 0, like this:

TweenLite.to($("#image"), .5, {rotation:180, parseTransform:true, clearProps:"rotation", onComplete:resetRotation});

function resetRotation()
{
    TweenLite.set($("#image"), {rotation:0});
}

Hope this helps,

Rodrigo.

[GreenSock]

Yep, sorry about that guys - it was a tricky issue with clearing the values out in a certain scenario, but it should be resolved in 1.10.3. I've attached a preview version of that - would you mind verifying that it resolves the issue for you? 

GSAP_1.10.3_preview2.zip

[Rodrigo]

Works great Jack.

 

Thanks,

Rodrigo.

[MaorF]

Thank you for the very quick reply, I don't think iv'e ever gotten such a fast reply on a support forum...

 

I used the Rhernando's fix with onComplete which works.

Odd why only 180 deg multiples dont get reset....

 

Any date on the 1.10.3. release????

 

Thanks again.

 

Maor

[GreenSock]

1.10.3 should be released before next weekend. No set date quite yet - we're working on a few things that we want to include in that release. Stand by...