Questions tagged [pace.js]

An automatic web page progress bar. Pace will automatically monitor your Ajax requests, event loop lag, document ready state and elements on your page to decide on the progress.

20 questions
9
votes
3 answers

pace.js "Hide everything but PACE until the page has fully loaded" local copy

I was able to hide everything but pace until the page had loaded when installing pace.js with eager.io. However, when using bower to install the plugin and downloading the css theme, I was unable to figure out how to do this.
sebko
  • 545
  • 4
  • 13
8
votes
4 answers

pace.js: "start" event not triggered?

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…
matt
  • 42,713
  • 103
  • 264
  • 397
6
votes
1 answer

Pace.js(Progress bar) for Ajax request is not working

In the documentation, it is written that you don't need to write code in general to use it. I have added that in my website, It is working fine on page load. But for any ajax request, it is not working. Do I need to add anything for ajax request?
Niks
  • 95
  • 1
  • 5
3
votes
1 answer

Use pace.js progress bar on page navigation

Here is what I want to achieve : To show progress bar on every page navigation (not a SPA). So I tried : $(window).on('beforeunload', function () { showLoadingBar(); }); This is working fine in most of case. But some how it is not…
Rakesh Soni
  • 1,293
  • 2
  • 11
  • 27
3
votes
4 answers

How do I append Pace.js to a custom location in the DOM?

I'm using Pace.js (http://github.hubspot.com/pace/) for a basic loader. It works great with no issues so far. However, what I would like to do, is append the Pace.js HTML to be inside an element of my choice. The generated HTML looks like:
Michael Giovanni Pumo
  • 14,338
  • 18
  • 91
  • 140
2
votes
0 answers

Use pace.js while file download is called

I would like to setup pace.js so it shows a loading animation while a pdf file is retrieved on server. But the default configuration of pace.js isn't doing it: When I click in the download link () my browser shows it's loading, but pace.js don't…
Bruno Lamps
  • 544
  • 6
  • 27
2
votes
2 answers

Pace.js not waiting for iframes to fully load

I'm using pace.js on my site and I'm having difficulties with pages that have iframes. Is there a way to make it so that pace.js takes into account the content loading inside of those iframes? I've tried setting the paceOptions to wait for the…
skrubbles
  • 21
  • 2
2
votes
3 answers

Animation not showing when ajax request in pace.js

In my website http://www.eventiame.com/publicar/ there's a form with several fields. When the page loads it shows the pace animation (it does some ajax request when loading so that's ok) but when I submit the form (I do it via ajax too) the…
AliNasiri
  • 137
  • 1
  • 3
  • 11
1
vote
0 answers

Stopping pacejs on smoothstate links

I'm trying to stop pace.js to load when the user clicks on Smoothstate links. I thought calling Pace.stop inside smoothscroll on events, using the ignore setting but still the event is triggered. $('.chronology-nav a').click -> …
adam
  • 618
  • 2
  • 11
  • 31
1
vote
0 answers

Pace.js Implementation

Am trying to setup pace.js. To show progress bar during upload and download. Intially am setting the startOnPageLoad: false, so it will no appear during page load. While clicking download or upload am calling the Pace.Restart(). And loading bar…
1
vote
1 answer

increase progressbar loading time in pace.js

I am using pace.js plugin, it works fine but I want that the progress bar will show for longer time, mean to increase the loading time, so user will see the loading screen for long time, by default it run fast. I will also look at these options but…
user4259777
0
votes
0 answers

Pace is not working for every ajax call on page

Using following code in my page: var paceOptions = { ajax: { trackMethods: ['GET', 'POST', 'PUT', 'DELETE', 'REMOVE'], restartOnRequestAfter: true } }; Still it is not working for the small ajax request.
smita chougale
  • 235
  • 5
  • 19
0
votes
0 answers

How i can get 2 loaders on same page. I am Using pace.js

This is the loader I am working on. The loader portion is working fine. But I also want to move that "balloon" div along with loader, like when the loader is on 0 the balloon will be like down, and when the loader is 100%, the balloon will move…
0
votes
2 answers

Pace Js when "done" the body scrolls up

I'm using the lovely pace.js as my page loader. I created a #cover to hide all the content while the loading process complete. #cover{ position:fixed; top:0; left:0; background:#000; z-index:99999; width:100%; height:100% } All I want, when the…
Federico
  • 1,392
  • 1
  • 17
  • 40
0
votes
1 answer

Weird Shape Pace.js

Just installed pace.js and paceThemeRound.css (centre radar theme) and I get a weird shape as image below. The problem is due to the fact that the script is conflicting with bootstrap.min.css. If I remove it from my website it is working…
QGA
  • 3,114
  • 7
  • 39
  • 62
1
2