Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
fernandocomet

AnimateCC TimeLineMax x value not working

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

Hi, 

 

I´m using Animate CC with TimeLineMax, sorry for being a beginner.

 

Can anybody tell me why the red square in the files attached is not moving to exactly coordenate x = 0 ?

 

I´m doing this:

var root = this, tl;


//gsap timeline
tl = new TimelineMax();
tl.to(root.logo, 1, {x:"0", ease:Back.easeOut});
tl.to(root.cuad, 2, {x:"0"});
tl.to(root.cuad2, 2, {x:"200", ease:Back.easeOut});
 
 
Thanks a lot!
 

 

 

 

300x250.zip

Link to comment
Share on other sites

Hey, Fernando!

 

I have a feeling its to do with the Registration Point in Animate CC, the little white circle (usually in the middle of a movieClip).

 

fenando-red-box.png

 

Moving it towards the edge of the box seems to solve the issue. I'm not very clued in on Animate CC these days, so if anyone else would like to chime in?

  • Like 3
Link to comment
Share on other sites

Yep it looks like the registration point of your movieclip symbol. :)

  • Like 1
Link to comment
Share on other sites

Yep it looks like the registration point of your movieclip symbol. :)

 

 

That's what it's called! Registration Point. I completely forgot.

  • Like 1
Link to comment
Share on other sites

  • 2 weeks later...

Hello All,

I have been playing around with GSAP in Animate CC and I noticed I can not animate width or height with TweenMax. Any suggestions or work arounds?

Thanks in advance!

Link to comment
Share on other sites

Hello All,

I have been playing around with GSAP in Animate CC and I noticed I can not animate width or height with TweenMax. Any suggestions or work arounds?

Thanks in advance!

Use scaleX for width and scaleY for height.

  • Like 2
Link to comment
Share on other sites

Use scaleX for width and scaleY for height.

Thank You. It worked. However, it seems the transformOrigin does not overide. For instance when I scaleX or Y the origin is 50% 50%, so it scales from the center. I need the width to increase from the top left or "0% 100%". I tried setting the registration in the properties on the object and setting the transformOrigin, but no dice. It only scales from the middle. Any advice?

Link to comment
Share on other sites

Thank You. It worked. However, it seems the transformOrigin does not overide. For instance when I scaleX or Y the origin is 50% 50%, so it scales from the center. I need the width to increase from the top left or "0% 100%". I tried setting the registration in the properties on the object and setting the transformOrigin, but no dice. It only scales from the middle. Any advice?

transform-origin is a css property; it won't work in canvas.  

 

To change the registration point in Animate, you would select your symbol and then move the white circle, as joe_midi described earlier in this thread.

  • Like 1
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.

×