[CSS][HTML][JavaScript]Wordpress preloader Opcje

[atom90]

Witam.

Przygotowalem progressbar do wczytywania strony na podstawie znalezionego przykladu:


https://jsfiddle.net/zg650281/38/


Chcialem go zaimplementowac na stronie z wordpressem, ale strona pojawia sie wczesniej niz progress bar, a pasek nie laduje sie.


Moze ma ktos pomysl co robie zle?

Strona:
http://small-atom.pl/

[atom90]

No tak, ale sam sobie pomieszalem. To juz do przodu jestesmy, jeszcze kwestia czemu animacja sie nie odpala

Edit

Dalem opoznienie seckundowe na ten skrypt wtedy zdazy polapac sie i naliczyc czas, ale zobaczymy czy to bedzie lepiej dzialac (rzeczywiscie gdy strona bedzie ladowala sie dluzej)

Ale prosil bym aby zerknac na to czy to dobre rozwiazanie czy jednak to nie jest dobre

Kod

//Page loader


setTimeout(function(){
    var width = 100,
        perfData = window.performance.timing, // The PerformanceTiming interface represents timing-related performance information for the given page.
        EstimatedTime = -(perfData.loadEventEnd - perfData.navigationStart),
        time = parseInt((EstimatedTime/1000)%60)*100;

    // Loadbar Animation
    $(".loadbar").animate({
      width: width + "%"
    }, time);

    // Loadbar Glow Animation
    $(".glow").animate({
      width: width + "%"
    }, time);

    // Percentage Increment Animation
    var PercentageID = $("#precent"),
            start = 0,
            end = 100,
            durataion = time;
            animateValue(PercentageID, start, end, durataion);

    function animateValue(id, start, end, duration) {

        var range = end - start,
          current = start,
          increment = end > start? 1 : -1,
          stepTime = Math.abs(Math.floor(duration / range)),
          obj = $(id);

        var timer = setInterval(function() {
            current += increment;
            $(obj).text(current + "%");
          //obj.innerHTML = current;
            if (current == end) {
                clearInterval(timer);
            }
        }, stepTime);
    }

    // Fading Out Loadbar on Finised
    setTimeout(function(){
      $('.preloader-wrap').fadeOut(300);
    }, time);
}, 1000);