Pausing / updating DOM elements rendering after gsap.to declared

[koder]

Hi guys,

 

I am a little confused on best way to tackle what I am working on, I am trying to make a bubble game where I can toggle the speed of some divs which are appended to the Dom every few seconds, but not sure the best way to do this?

Usually the divs people manipulate are there already so they can just use the class and set the instants as a variable to use .pause() etc on but its not playing nice with my current set up.

 

EDIT: In regards to the sleep / pausing, I am looking to update elements on the page, it already pauses new bubbles from appearing / changes the speed of new rendered ones, just not for items on the page currently

Anyone put me in the right direction? (code pen included)

 

p.s: Im pretty new so excuse me if I have not followed any rules!

 

See the Pen poRwvBP by kod33rrrrr (@kod33rrrrr) on CodePen

[PointC]

Hi @koder

 

Welcome to the forum.

 

If I understand your desired outcome correctly, I think this may be a good time to use the global timeline. You can easily change the timeScale or pause all animations. More info.

https://greensock.com/docs/v3/GSAP/gsap.globalTimeline

 

Happy tweening and welcome aboard.

 

[koder]

31 minutes ago, PointC said:

Hi @koder

 

Welcome to the forum.

 

If I understand your desired outcome correctly, I think this may be a good time to use the global timeline. You can easily change the timeScale or pause all animations. More info.

https://greensock.com/docs/v3/GSAP/gsap.globalTimeline

 

Happy tweening and welcome aboard.

 

You are an absolute legend! Exactly what I needed, works flawlessly!