Prioritize "Page Load" interaction

Hi dear all,

I have set up a page load interaction so that my website is “hidden” by a massive full screen div for half a second, the time the layout needs to load behind it… after .5 second, the interraction fades out, revealing the layout. (interaction is to be found in: Event folder > Event 01)

Screen recording:

https://www.loom.com/share/8d98881057914e6596622b5f0af9b34d

Read only link:
https://preview.webflow.com/preview/furtherdev?utm_source=furtherdev&preview=85fdcae03245c4855b9e10506145d5aa

The problem is, even-though the interaction is set to run on page load, it happen a few milliseconds after the very layout I’m trying to hide is being shown. In the Webflow designer preview however, everything works as expected: the page load with the white div masking the entire page, then fades in after 0,5 seconds revealing the layout underneath.

My question is:
How can I prioritise this onload interaction so that this is the very first thing the browser sees and loads ?


Here is my public share link: LINK
(how to access public share link)

Hey @anthonysalamin

In your page Header code, try adding:

.loading{display:block;opacity:1}

Best,
Blaise

2 Likes

Clever !
Thank you so much !
That totally did the trick !

Much appreciate :slight_smile:

1 Like