I don’t know if this is a Forge issue or Bricks or just a general concept. I have animations that are 0 opacity with a translate and that’s about it. I typically setup the animations as “From” type. Also these are scroll triggers usually, because I only use page load trigger for hero stuff.
When the page loads, the content is visible for a split second, then disappears, then the animation happens. It’s annoying and when clients see all the content “flash”, they think the page is loading twice or something.
Obviously this is mostly regarding content that is already in the viewport when the page loads. So above the fold stuff or if they happen to already be scrolled down the page and then reload, it happens there too. It’s not really an issue for elements already off screen that scroll in later.
I know there is a setting in the Forge panel that says “Prevent Fouc” but that didn’t do anything when I clicked on it, the issue still happens.
I’ve seen posts in the Bricks forum also about flashing of content when using animations.
What is the trick make this work right?
That’s expected GSAP behavior: Avoiding FOUC | GSAP | Docs & Learning
Bricksforge comes with a “Prevent Fouc” functionality which you can use to remove the flashing 
Check here: Bricksforge Panel – Bricksforge Docs
I have exactly the same problem. Have you already been able to solve it? Prevent Fouc was not a solution either
I specifically stated the Prevent Fouc feature didn’t do anything.
I didn’t solve it, but I noticed it is much better if I have a small delay on the animation. For whatever reason, if you add maybe just 50ms delay, the issue is not as bad.
Another solution is to set the CSS to opacity:0 directly on the element. That way, it’s invisible via CSS as fast as possible without having to wait for the animation stuff to load and then hide it. But you can’t do this in the Bricks panel because the Bricks panel opacity setting overrides the one from Forge. So you would have to use custom CSS (loaded early).
I don’t know what the ultimate solution is.
I also can’t get Forge animations to work within Bricks sliders. I’ve messed with settings so much, but I can’t get animations to reset and replay when the slides come into view. I know there are triggers for it, and they don’t seem to work.
I just wanted to let you know that the “Prevent Fouc” function is now working perfectly. I no longer have flashing.
1 Like