pace.js: "start" event not triggered?

Question

I can't seem to find a solution to this problem I posted in the comments of this question … I'm using the pace.js plugin and I would love to load/show parts of my page immediately without having to wait for the preloader to load all content.

I thought of doing this by simply calling the start event and show the selector immediately.

However I can't seem to find the cause why my done event is fired, but start is not. I also tried with hide which is also fired, but stop or restart is not.

$(window).load(function(){

    Pace.on('start', function() { 
        alert('start') // not fired
    });

    Pace.on('done', function() {
        alert('done') // fired!
    });

});

Any ideas?

score 6 · Accepted Answer · answered Dec 17 '14 at 10:08

6

Call Pace.start(), right after event bindings. You then will be able to get the start event.

answered Dec 17 '14 at 10:08

@matt: Sorry, I have no exp with Pace. Please, create a new question for your current requirement. – Dec 17 '14 at 13:09

score 5 · Answer 2 · answered May 21 '16 at 10:29

5

You will need to call

Pace.restart();

if the current page has already loaded with pace progress.

answered May 21 '16 at 10:29

Vishal Kumar

4,419
1
25
31

score 3 · Answer 3 · edited Mar 10 '15 at 10:01

3

You have to put

Pace.on('start', function() { 
   alert('start');
});

outside $(window).load.... After that it will get start status, You are calling These methods after documentation is loaded so start must be already triggred.

edited Mar 10 '15 at 10:01

l2aelba

21,591
22
102
138

answered Jan 05 '15 at 07:09

goldeneye

31
3

score 1 · Answer 4 · answered Jul 20 '16 at 14:12

after registering script and css, on your htlm section add this script

    <script type="text/javascript">
        window.onbeforeunload = renderLoading;
        function renderLoading() {
            Pace.stop();
            //Pace.start();
            Pace.bar.render();
        }

pace.js: "start" event not triggered?

4 Answers4