Oxygen Builder page load animation

We are going to be doing a Page load functionality inside oxygen builder, for full code and tutorial visit this page
oxytransfer.com/do-a-page-loa...
There is a discount on copy paste plugin: use code: happyeaster
it is valid till 19th April 2020

[@keaton718]

I'm going to try this, thanks!

[@tietienne82]

Worked for me: Thank you very much!

[@techsoup_dev]

Glad it helped

[@tietienne82]

@@techsoup_dev I have an issue with the loader though: The first time the page loads, the loader animation and the page below is showing all together and it takes a few seconds for the loader to be full screen and centered. Any suggestions why?

[@techsoup_dev]

@@tietienne82 You can make a wrapper around your content/page below the loading block and just add display none or opacity 0 and within ur loading animation js make it display block/opacity:1 on ending of loading

[@tietienne82]

@@techsoup_dev Thanks for taking the time to reply but I have no coding skills and I am not sure what I need to add to the js. Also, where do I add "display none or opacity 0"? In a code block?

[@livecanvas]

Try this one with our Pure HTML and CSS builder :-)

[@UnaNeary]

Thank you for explaining how to do this in Oxygen.
However, I cannot get the loader-wrapper to put the gif in the center. It still stays to the left side

[@techsoup_dev]

can you send link to your site where you implemented, alternatively try doing margin: 0 auto; or text-align: center; depending on how would have made your container.

[@UnaNeary]

@@techsoup_dev Thank you, it is working now, I think there was some glitch the first time I tried. I redid it from a blank install and now it works perfectly as you demonstrated. :)

[@techsoup_dev]

@@UnaNeary awesome :)