Share Posted May 4, 2022 Hi, what I would like to achieve is to have the fly flapping its wings for 2 seconds or so, then stop and start flapping again after 5 seconds,... I know I could use setTimeout and setInterval, but I guess this should also be possible with GSAP properties only... I tried several combinations but somehow I don't get anywhere. Any ideas? 😬 See the Pen xxXOMpg by rob83 (@rob83) on CodePen Link to comment Share on other sites More sharing options...
Solution Solution Share Posted May 4, 2022 I think I'd limit the number of repeats on the tweens so you can use your timeline repeat and repeatDelay. Maybe something like this: See the Pen 8525298a3d05e41cdde6eafed8768319 by PointC (@PointC) on CodePen Hopefully that helps. Happy tweening. 4 Link to comment Share on other sites More sharing options...
Share Posted May 4, 2022 Cool fly! in situations like this another option is to create the infinite animation and then control it inside another timeline. In the demo below I tween the time() value of wings timeline from the main timeline. See the Pen XWZbeYO?editors=1010 by snorkltv (@snorkltv) on CodePen We can have fun with the speed of wings flapping by changing the duration on the time() tweens. Notice the last tween tweens to a time:4 in 1 second (very fast going up) .fromTo(wings, {time:0}, {time:4, duration:1}, "<") 3 Link to comment Share on other sites More sharing options...
Share Posted May 4, 2022 uh-oh. @Carl is getting all fancy. Looks like we've got an old fashioned tween answer battle. 3 Link to comment Share on other sites More sharing options...
Share Posted May 4, 2022 Stay with original infinite timeline and tween the timeScale() approach. See the Pen f5adcb0f2061e000f83c798e0f782819 by PointC (@PointC) on CodePen 3 Link to comment Share on other sites More sharing options...
Share Posted May 4, 2022 Okay, it's May The 4th so I couldn't resist. I present Fly Wars. See the Pen jOZPYQV by PointC (@PointC) on CodePen 2 Link to comment Share on other sites More sharing options...
Share Posted May 4, 2022 LOL. Nice one, @PointC! 🙂 Link to comment Share on other sites More sharing options...
Share Posted May 4, 2022 48 minutes ago, PointC said: Okay, it's May The 4th so I couldn't resist. I present Fly Wars. Please add in a fire button so we can shoot at the fly. 🙏 Link to comment Share on other sites More sharing options...
Author Share Posted May 5, 2022 🤣 Thanks so much, @Carl and @PointC!! That were defenitely helpful answers plus great ideas how to pimp up my game!! Maybe I can convince my boss to go with the fly wars version! 😜 3 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now