Jump to content
Search Community

rotation:180 does not work twice

MaorF test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

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

Link to comment
Share on other sites

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.

Link to comment
Share on other sites

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

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...