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
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it