Jump to content


Animation Circle yoyo

Recommended Posts

Hi, I'm a beginner with tweenmax and I was playing with basic animations. Instead of doing the animation with "animate" I wanted to try to animate a circle with the yoyo effect, but the animation is not central. Thanks in advance for advice.

See the Pen YYVERo by kaos-alessio (@kaos-alessio) on CodePen

Link to comment
Share on other sites

Hi alessio,


Just use transformOrigin. :)


TweenMax.fromTo('.test', 0.6, {scale: 1}, {scale: 1.1, repeat: -1, repeatDelay:0, yoyo: true, transformOrigin: 'center center'});


  • Like 7
  • Thanks 1
Link to comment
Share on other sites

Hi @alessio :)


Welcome to the forum.


You just need to add transformOrigin to your tween so the element scales from the middle like this:


TweenMax.fromTo('.test', 0.6, {scale: 1}, {scale: 1.1, transformOrigin:"center center", repeat: -1, yoyo: true});


More info here:



Hopefully that helps. Happy tweening and welcome aboard.

  • Like 5
  • Thanks 1
Link to comment
Share on other sites

@JPF @PointC Thanks for the timely answers. I will reread the docs to understand better.

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.