ScrollTrigger Not firing

[Cassie]

Hey, I'm not really sure why this would make a difference unless either the text coming from the backend is dynamically injected later than page load or the class itself is added later?

My guess would be that the fonts are loading later and causing a layout shift?

maybe...

document.fonts.ready.then(function () {
  ScrollTrigger.refresh()
});

If this doesn't help please give us a demo showing the issue. Thanks

[Nick.Ls]

18 minutes ago, Cassie said:

document.fonts.ready.then(function () {
  ScrollTrigger.refresh()
});

I am executing the entire splitting / animation function on document loaded.

 

document.addEventListener('DOMContentLoaded', function() {

 

Shouldn't this be include the fonts loaded?

Thanks!

[Cassie]

Not always no, it's dependent on your font loading strategy

https://stackoverflow.com/questions/25223470/does-domcontentloaded-wait-for-web-fonts-firefox#:~:text=NO%2C it does NOT!,to make it pixel perfect.&text=inside the head (it's called browser preload hints).

[Nick.Ls]

I am preloading the fonts to be honest but I will set the animations based on that and see what happens.

For the time being I have a workaround already for my scenario.

Thank you once again!