Jump to content
Search Community

quickTo specific case

Michael31 test
Moderator Tag

Go to solution Solved by OSUblake,

Recommended Posts

I like to create a drag effect that makes my shape rotate around a circle.

It works great, I'm also using the quickTo method to add some cool easing on it. 

 

My issue is that when the rotation is complete, it all starts again by reverting.  I'd like to keep my current position and go back to 0 directly.

 

Should I kill and recreate my quickTo tween when I'm beyond the complete rotation ?

Thank you

See the Pen JjMQmJJ by michaelgrc (@michaelgrc) on CodePen

Link to comment
Share on other sites

  • Solution

Hi Michael,

 

Have you seen the new Observer plugin? You can simply some of your event handling with it. 😉

 

https://greensock.com/docs/v3/Plugins/Observer

 

As far as the rotation goes, you'd have to do some math to get it to work correctly, kind of like what is shown in this post for making a generic directionalRotation plugin. The code in that pen that is inside the if statement for short is what you would need to do.

 

 

Or just use the built-in directional rotation, but you'd need to use a regular tween.

 

gsap.to(this.elRotation, {
  rotation: `${degree}_short`,
  overwrite: true
})

 

See the Pen mdpZQEZ by GreenSock (@GreenSock) on CodePen

 

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