timelinelite TimelineLite animation stops when window lost focus, when switching to another window tab

[Geeeva 6 Likes (Newbie)]

Hi guys,

my TimelineLite animation in React JS stops after switching to another window tab. Is there a solution to prevent that?

I saw one older topic https://greensock.com/forums/topic/11831-solved-tweenlite-animation-stops-when-window-lost-focus/ ,

but as it was in question TweenLite and I am using TimelineLite this is not a solution to my problem.

I haven't seen any similar property like TweenLite.ticker for TimelineLite.

 

Can somebody help?

[OSUblake 18,533 Likes (Superhero)]

1 hour ago, Geeeva said:

I saw one older topic https://greensock.com/forums/topic/11831-solved-tweenlite-animation-stops-when-window-lost-focus/ ,

 

That's the answer. Try it.

[OSUblake 18,533 Likes (Superhero)]

And it might be better to use an event listener to change that, like page visibility.

https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API

 

Or maybe blur and focus. 

 

[Geeeva 6 Likes (Newbie)]

I got an error in React when I implement ticker property on TimelineLite: 

Quote

TypeError: Cannot read property 'useRAF' of undefined

I have seen in docs that ticker is not supported in TimelineLite: https://greensock.com/docs/TimelineLite I will try now second suggestion.

[OSUblake 18,533 Likes (Superhero)]

There is ONE ticker, and it controls everything: TweenLite/Max and TimelineLite/Max. You access it through TweenLite.

 

https://greensock.com/docs/TweenLite/static.ticker

[Geeeva 6 Likes (Newbie)]

The second seconds suggestion works perfectly, I also relied on 

Thanks OSUblake 

[Geeeva 6 Likes (Newbie)]

And the first suggestion also works, as the younger brothers of TweenLite inherit everything