I've just started using WiXCode and I'm very new for Javascript.
I was referring to WiX resource 'https://www.wix.com/code/home/example/Preloader'
and I was trying to have a preloader that is connected to a Lightbox.
But somehow it is showing some error. You can refer to screen-recording: http://take.ms/15AEG
Surprisingly when I connect this with a 'Box' it works perfectly fine.
Here is the code that I'm using:
$w.onReady(() => {
waitForLoading();
});
export function button6_onClick() {
$w('#lightbox1').show();
waitForLoading();
}
function waitForLoading() {
setTimeout(() => {
$w('#lightbox1').hide('FadeOut');
}, 1500);
}
Also, do I really need to use this code?
export function button6_onClick() {
$w('#lightbox1').show();
waitForLoading();
}
Can someone please help.
Thanks,
Pawan
Hi Roi,
I've implemented this code on 2 websites.
On buth the websites sites gets loaded first and than the preloader.
https://www.mindnifisant.com/
https://lioonnize.wixsite.com/mezonic
Both the sites are pathatically slow cos of WiX, but I need to load preloader first.
Let me know what I'm doing wrong here.
Here is the code from the sites for both the pages (Preloader and site code)
Site: https://www.mindnifisant.com/
Page Site Code:
import wixWindow from 'wix-window'; $w.onReady(() => { wixWindow.openLightbox("Preloader"); });
Preloader Code:
import wixWindow from 'wix-window'; $w.onReady(() => { setTimeout(() => { wixWindow.lightbox.close('FadeOut'); }, 1500); });
Site: https://lioonnize.wixsite.com/mezonic
Page Site Code:
import wixWindow from 'wix-window'; $w.onReady(() => { wixWindow.openLightbox("Preloader"); }); export function anchorheader_onviewportEnter() { $w("#LogoB").show(); $w("#largeS").show(); $w("#MenuBar").show(); $w("#cart").show("FloatIn"); $w("#buynow").show(); $w("#LoginBar").show(); $w("#LogoS").hide(); $w("#smallstrip").hide(); $w("#MenuBox").hide("FloatOut"); } export function anchorheader_onviewportLeave() { $w("#LogoS").show(); $w("#smallstrip").show(); $w("#MenuBox").show(); $w("#LogoB").hide(); $w("#largeS").hide(); $w("#MenuBar").hide("FloatOut"); $w("#cart").hide("FloatOut"); $w("#buynow").hide("FloatOut"); $w("#LoginBar").hide("FloatOut"); }
Preloader Code:
import wixWindow from 'wix-window'; $w.onReady(() => { setTimeout(() => { wixWindow.lightbox.close('FadeOut'); }, 1500); });
Please help.
Thanks,
Pawan
Hello, I read this discussion looking for a solution to the same problem and actually the problem of passing data when the page was finished I could not solve it. Do you have something in mind?
Thank Roi.
But if the lightbox is acting as a preloader, how will you call to close the lightbox from the code on the page that indicates all data is loaded?
Thank you so much its working now.
Yes,
import wixWindow from 'wix-window'; $w.onReady(() => { }); export function button6_onClick() { wixWindow.openLightbox("LightboxName"); }
And here is some code you need to add to the lightbox
import wixWindow from 'wix-window'; $w.onReady(() => { setTimeout(() => { wixWindow.lightbox.close(); }, 1500); });
Roi
Hi Roi,
Would be great help if you can show an example code here.
Thanks,
Pawan
Hi Pawan,
Use openLightbox and close methods in order to open and close the lightbox.
Good luck!
Roi