This is a test of a javascript progress bar.

Usually the slowest part on a page to load is the images. So the javascript file, progress.js, for this page uses the variable 'complete' on all the image elements to see whether they are done loading or not. For each image that is done loading it displays a progress indicator and a percentage. For more information just look at the javascript source. Right click on the two links and click on "Save Target As..." progress.js progress.htm

Notes:

9/19/07 - v. 1.2 - Previously if you had a VERY large document and/or a lot of ads like adsense ads that were slow loading and/or a user was accessing your web page using dial-up, then the progress_bar() function would just count 1 or 2 images for the document even though there might be 5 or 6. When this happened the progress bar would close prematurely. So now there are added functions to make sure that the body of the document is completely loaded before we close the progress bar. That way the script can count the true amount of images on the page with var image_count = document.getElementsByTagName("img").length;.

With all browsers I could just use the window.onload function to find out if the document is done loading. But I did not want to rely on this function just in case you may be using it in your own javascript functions. If you are not using it then you can uncomment the line window.onload = saydone;. (For now I have a timer function set for these other browsers to close the progress bar. See the javascript file for info.)

For the most popular browsers (IE, Netscape, Firefox, Safari) I was able to use some built-in functions to check to see if the document was loaded.
For Internet Explorer and Safari:
if (document.readyState=="complete")
Then for IE we can have it listen for a readyState change with:
document.onreadystatechange=checkstate;
For Safari we do not have a onreadystatchange attribute so we have to periodically check the document.readyState value with a timer function. That is what progress_bar() is doing.
For Netscape and Firefox:
document.addEventListener("DOMContentLoaded", saydone, false);

9/18/07 - v. 1.1 - Previously if a very large image was loading then the progress bar would sit there at a certain percentage. Now the progress bar will move up 1% every second until the image is done loading or until the bar reaches the next bar_part's percentage (where it should be for the next image.)

9/6/07 - v. 1.0 - Progress Bar Created