Jump to content
Search Community

Pendulum effect rotation Reverse

jonForum 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

Hi guys, i search some code example on this forum, but i found nothing that show a Pendulum effect with tweenLite or with TimelineLite?
Someone would have a functional example to create a permanent pendulum effect?

 

See the Pen bQNGep?editors=0010 by djmisterjon (@djmisterjon) on CodePen

 

My target it to get something similar that spine2D allow.
for help to understand, i just want replace spine by vanilla js and vanilla tweenLite feature, because i get more performance after my test with tweenLite.

wY7cc4Pj_o.gif
But am not sure how do a pendulum loop with tweenLite.
If you can provide me demos or link to the docs it will be wonderful

Maybe i just don't get the good keyword for search!
sorry again for poor english, thank guys.

 



 

See the Pen bQNGep?editors=0010 by djmisterjon (@djmisterjon) on CodePen

Link to comment
Share on other sites

First part is to go away from center, after that you can swing from end to end. It gets really simple if you use TweenMax instead of TweenLite. With TweenMax you can set repeat to -1 which will keep repeating it to infinitely. And then set the yoyoEase to true so easing effect will be same while reversing. If you just want to use TweenLite, then you will need to call a function onComplete callback after first part. Then inside function define a tween that goes to end, and onComplete call itself.

 

 

 

See the Pen QJwwaV?editors=0010 by Sahil89 (@Sahil89) on CodePen

 

If you just want to use TweenLite then you will need to call a function after first part completes, pass 1 as parameter to it. After that inside function you need to define tween that swings end to end, now pass negative of the parameter so on next call pendulum will swing away. You also need to pass the scope, to define what is 'this' inside function.

 

But to be honest you are just making your life hard by not using TweenMax, as you will not notice any significant performance hit when using TweenMax.

 

See the Pen MzYYVR?editors=0010 by Sahil89 (@Sahil89) on CodePen

 

  • Like 6
Link to comment
Share on other sites

@Sahil Yes, you're right.
The tweenLite approach is interesting and tweenMax is look much cleaner to work with.
I intend to get it because for the moment I can not debug it in nwJs and vsCode, I need a license and i will get it when i will have time.
thank you so much you are awesome and this will help me understand under the hood.

ps: The only reason why i am still not have tweenMax is that greensock does not yet take paypal for transactions.
My fund for the web are on paypal, but as soon as this possible, I will buy it.

  • Like 1
Link to comment
Share on other sites

Quote

The only reason why i am still not have tweenMax is that greensock does not yet take paypal for transactions.

 

I am not sure because when I had purchased license I was in real hurry but I feel like there was option to pay using PayPal. @GreenSock can you confirm?

 

Also, I think you can start developing using TweenMax and purchase the license before you publish your game.

Link to comment
Share on other sites

after deep check ho yes it allowed , 
0Ugz2Xdn_o.png

It because a was searching for the classic big paypal button haha ! 
 

Quote

Also, I think you can start developing using TweenMax and purchase the license before you publish your game.

if i remember , tweenMax block on nwjs and vsCode or if is just plugin ? am not remember.
LXjr8IVm_o.png

 

But now i see paypal, i will get it .
thank for your time.

 

 

  • Like 1
Link to comment
Share on other sites

40 minutes ago, jonForum said:

Did you know if is there a official or good un-official discord or slack community for greensock ?

 

Not that I'm aware of. The best community are the forums actually.

 

Normally everyone tries really hard to help users as fast as possible (as @Sahil just did) and we always do it with a friendly touch. Don't be afraid of asking GSAP related questions here, that's the whole reason for the forums. Also there are not stupid questions around here, this is definitely not StackOverflow where you'll get down-voted for your questions. So if you have questions, just post them here.

 

Finally keep in mind that there are over 52,000 posts here, so do a detailed search, because there is a good chance that whatever you're struggling with, has been answered already, like you just did of course ;) 

 

Happy Tweening!!

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