Witam po raz kolejny.
Mam pewien problem z preloaderem, który nie do końca spełnia swoją rolę.
Mianowicie, gdy wchodzę na stronę najpierw pojawia się nieostylowany dokument z cała treścią, a po jakimś czasie dopiero odpala się preloader - który powinien być ładowany na samym starcie i zakrywać niezaładowaną treść.
https://github.com/42savage/agmar_v2
Dorzucam plik index.js
// IMPORTY
import { preloader } from './preloader';
require('jquery');
require('./styles/main.scss');
require('./styles/phone.scss');
import 'slick-carousel/slick/slick';
import {TweenMax, Power2, TimelineLite} from "gsap/TweenMax";
import 'jquery-viewport-checker';
import { imageGallery } from './imageGallery';
imageGallery()
preloader();
// SLICK SIDER
window.onload = function(){
setTimeout(function(){
$('.slider').slick({
dots: true,
mobileFirst: true,
autoplay: false,
draggable: false,
prevArrow: $('.prev'),
nextArrow: $('.next'),
pauseOnDotsHover: true,
pauseOnHover: false
});
},3200);
}
//back-to-top
var backTop = $('.backTop');
$(window).scroll(function() {
if ($(window).scrollTop() > 800) {
backTop.addClass('show-top');
} else {
backTop.removeClass('show-top');
}
});
backTop.on('click', function(e) {
e.preventDefault();
$('html, body').animate({scrollTop:0}, '800');
});
$(document).ready(function() {
setTimeout(function() {
$('.body-test').attr("style", "overflow: auto;");
}, 4000);
});
i preloader.js, który jest importowany do powyższego głównego pliku.
import { content } from './animations'
export function preloader(){
var preload = document.getElementsByClassName('preload')[0];
preload.classList.add('show-preloader');
window.addEventListener('load', function () {
preload.classList.remove('show-preloader');
content();
});
}