How to set a preloading page and avoid the header temporally

Hi, guys! I am working on setting a pre-loading page for my wix website, and I am using this code below. It works well, but I just cannot get rid of the header while it is loading. Is there a way to hide the header while it’s loading or make the loading box in front of the header?

$w.onReady(() => {
	waitForLoading();
});

export function button6_onClick() {
	$w('#columnStrip1').show();
	waitForLoading();
}

function waitForLoading() {
	setTimeout(() => {
		$w('#columnStrip1').hide('FadeOut');
	}, 3000);
}

Hi I am also currently doing something like this, here is my code that worked for me:

$w . onReady ( function () {
waitForLoading ();
});

export function button6_onClick ( ) {
$w ( ‘#columnStrip1’ ). show ();
waitForLoading ();
}

function waitForLoading ( ) {
setTimeout (() => {
$w ( “#myLogo” ). show ( ‘FadeIn’ );
$w ( “#navMenu” ). show ( ‘FadeIn’ );
$w ( ‘#columnStrip1’ ). hide ( ‘FadeOut’ );
}, 6000
);}

in this case, #columnStrip1 is my preloading screen,
#myLogo and #navMenu are the contents within my header.
You have to hide your header items in the properties menu, to trigger the fade in functions for them after the timeout.

Let me know if this works for you. Cheers! :grin: