Disable Preloader

Ask the community
,
1

Hi, I’m having trouble with my preloader since I don’t really know how to code. Right now the preloader is there every time you go to the home page. How do you make it work only on the first time you enter the site?
This is my code so far that I copied from a template:

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

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

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

2

First time ever? first time per session? first time before page reload?

3

first time per session i think. sorry not very good with technical terms

4

@miaxie

import {session} from "wix-storage";
let status = session.getItem("status");
$w.onReady(() => {
    if(!status){
    waitForLoading();
    session.setItem("status", "revisit");
    }
})
5

@jonatandor35 where does this go in my code?

6

@miaxie instead of this part:

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

@jonatandor35 it doesn’t seem to be working. when i click on the home page link the preloader is still present

8

@miaxie you should make it hidden onload (via the property panel). Then this code will show it for the first time only.
Like this:

import {session} from "wix-storage";
let status = session.getItem("status");
$w.onReady(() => {
    if(!status){
     $w("#columnStrip2").show();//I assume this is the preloader
    waitForLoading();
    session.setItem("status", "revisit");
    }
})

alternatively you can leave it shown, and use this code instead:

import {session} from "wix-storage";
let status = session.getItem("status");
$w.onReady(() => {
    if(status === "revisit"){
            $w("#columnStrip2").collapse();
    } else {
           waitForLoading();
           session.setItem("status", "revisit");
    }
})
9

@jonatandor35 it works now! thank you so much!

10

You’re welcome :slight_smile:

11

@miaxie You can also test it with memory instead of session.
The main difference is that memory forgets the previous visit once you refresh the page (but it will remember it if you navigate back to this page without a refresh) while session remembers the previous visit even if you refresh the page. So see what’s best for you.

12

@jonatandor35 got it. this was super helpful thank you again!