Initialize the page load browser indicator / animated icon using JavaScript

Is there an easy way to start and stop the throbber browser (page load indicator) without changing the page you're on? Preferably without external libraries or AJAX calls.

+8
javascript browser
source share
3 answers

Not. You can try to make it spin by making ajax calls or something else, but don't do it. This part of the browser is not for you, it is for the browser!

This is like asking if you can change the system clock to make your game, including the time machine, more realistic.

+12
source share

You can name the simple server side of the script, call it "sleep.cgi", which will stop the sleep and delay the delivery of some simple self-loading page in a hidden iframe. This should be done by almost any large browser that displays what you call the "throbber browser" (page load indicator). As soon as you finish for whatever reason you want the ripple to display, you simply reset the mentioned iframe location should have an empty string. Here's how I do it:

1) write a simple server side script that takes the request and stops execution for 30 seconds, not wanting to remove the timeout wall of the browser page load. Once the waiting period is completed, this script server responds with something line by line:

<html><body onload="location.reload();"></body></html> 

causing it to loop until you want the browser to display the "page loaded" indicator.

2) write JavaScript helper functions that will start and stop "throbber" on request and add HTML elements that we will use:

 <script> function startThrobber(){ document.getElementById('throbberFrame').src='sleep.cgi?'+Math.random(); } function endThrobber(){ document.getElementById('throbberFrame').src=''; } </script> <div id="throbberWrapper" style="display:none;visibility:hidden;"> <iframe id="throbberFrame" style="width:1px;height:1px;"></iframe> </div> 

I did a quick test in Chrome / IE / Opera / Firefox and it seems to work fine. I have never had to do anything like that.

EDIT: If your web server supports PHP scripts, here is a link to the sleep function: http://php.net/manual/en/function.sleep.php I am not writing in PHP, but what your PHP document should look like more or less like this:

 <html><body onload="location.reload();"> <?php // sleep for 29 seconds sleep(29); ?> </body></html> 

Hooray!

+3
source share

The user interface freezes if something is loading very CPU intensive, so you will never see an animated GIF or a progress bar.

You have an XY problem. You can prevent browser freezes by using setTimeout to split CPU intensive operations into smaller pieces. Tibetan browser - a user interface element that signals that something is downloading from the network; it is extremely confusing if you used it for other reasons.

+1
source share

All Articles