Animation don't load properly

[yorgos]

Hello,

I am building a website and I face a problem during the loading of my animation. When I load the page to an uncached browser the big animated titles break. It seems that the don't use the full width of their container. If you refresh the page, they work fine. Can you help me? Here is the url: http://mascista.com.instantlink.co.uk/

[Rodrigo]

Hi @yorgos and welcome to the GSAP Forums!

 

Unfortunately we can't do a lot on a live site, because we don't have any way to access and tinker with the code, even further debugging a full website is super difficult because of the amount of code in it.

 

The few things I can see is that you have Flash Of Unstyled Content (FOUC):

https://gsap.com/fouc

 

Also you can create your animations after the fonts are loaded as well:

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

document.fonts.ready.then(function () {
  // Create your animations here
});

Hopefully this helps.

Happy Tweening!

[yorgos]

This was very helpfull.

Thank you!