Preloader

[mw]

Hey,
I tried to implement a preloader to the site similar to: https://weberruss.com/expertise/
(I couldn't really find out how they did it, but it's a lay theme site)

I tried this:
Custom HTML at top:
<div class="preloader"></div>

Custom <head> content:
<script>
window.laytheme.on("newpage", function() {
jQuery('.preloader').fadeOut('slow');
});
</script>

Custom Css:
.preloader {
width:100vw;
height:1px;
position:absolute;
background: black;
margin:0;
animation: fillup .4s ease infinite;
top:0;
left:0;
}

@-webkit-keyframes fillup
{
from { width:0px; }
to { width:100%; }
}

–
The code works, but only on a page reload. So if click on another menu item nothing shows up. (The javascript fadeout works at least)

I used to do preloaders with this js, but have rewritten it according to the laytheme documentation:

$(window).load(function() {
$('.preloader').fadeOut('slow');
});

to:
<script>
window.laytheme.on("newpage", function() {
jQuery('.preloader').fadeOut('slow');
});
</script>

–
I probably made a mistake there - could you help me?

Many thanks in advance,
Markus

[mariusjopen]

Dear @mw
did you try both options to run the Javascript?

http://laytheme.com/documentation.html#custom-javascript

Best!

Marius

[mw]

Yea, I tried "newpage" and "newpageshown" - both don't work

the thing is I am not sure if:
window.laytheme.on("newpage", function() {

really replaces:
$(window).load(function() {

but according to the documentation it should right?
Maybe you have an idea?

Best, Markus

[mariusjopen]

Dear @mw
I cannot see it on the example.

You want to show an image when you open the page and then remove it?

best!

Marius