Preloader
-
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 -
Dear @mw
did you try both options to run the Javascript?http://laytheme.com/documentation.html#custom-javascript
Best!
Marius
-
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
-
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
