Using LightBox as PreLoader

Ask the community
,
1

Hi,

I am trying to auto start a Lightbox on the 1st load of my homepage. I want it to run a small video then automatically fade out once the video is finished (9s).

The issue is that I can’t figure out how to make it reference the lightbox specifically.

When I hit “Preview Code” it gives me the error
" TypeError: $w(…).hide is not a function"

This is the code I am using, can anyone help me?
Thank you!

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

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

function waitForLoading() {
setTimeout(() => {
$w(‘#lightbox2’).hide(‘FadeOut’);
}, 9000);
}

2

It doesn’t even need to fadeout, I just want it to be the first thing to appear on screen on my website when first loaded. I can use a button inside the Lightbox to exit.

3

bump

4

Please do not bump questions.

You get the error “TypeError: $w(…).hide is not a function” since hide() and show() are not API functions for a Lightbox.

You should read the Lightbox API documentation to see what features and functions are available:
openLightbox()
Lightbox API

Here’s a simple Lightbox example which you can load in the Editor, play with, learn how it works, and then adapt for your own use.