PROGRESS BAR WHILE LOADING A PAGE

Question

All,
iam using below code and its working good with page submit button but i need it for a page load i.e when a page loads show the progress bar(page which take a while to load) so i can call it like onload. Anybody who has done this pls i appreciate if you could help...
function html_Submit_Progress(pThis){ 
$x_Show('AjaxLoading');
window.setTimeout('$s("AjaxLoading",$x("AjaxLoading").innerHTML)', 900);
doSubmit('APPLY_CHANGES');
function submit_HideAll(pThis){ 
$x_Hide('wwvFlowForm');
doSubmit('APPLY_CHANGES');
function submit_ButtonRegion(pThis){ 
$x_Hide('button_region');
doSubmit('APPLY_CHANGES');
using apex 4.1 and my page here i need it is a popup.
thanks

Answer 1

You can fix that in your page template by putting something like this just before the BODY tag in the Header region:
<div id="loading"
  style="display: block;
         position: fixed;
         top: 0px;
         left: 0;
         z-index: 1999;
         width: 100%;
         height: 100%;
         background-color: #fff;
         text-align: center;">
<div style="position: relative;
            top: 130px;">
Wait..loading..
</div>
<img src="#IMAGE_PREFIX#themes/theme_200/images/loading.gif" height="32" width="32"
   style="position: relative;
          top: 150px;"/>
</div>and putting something like this just after the closing BODY tag in the Footer region:
<script>
$(document).ready(function(){
  $('#loading').hide();
</script>