El JavaScript que mostraremos a continuación, permite insertar una barra en el centro de la página que especifica que el sitio está cargando su contenido. Una vez finalizado, elimina la barra y muestra la página.
Ejemplo:
Cargando página... (tu barra de carga)
Para hacerlo, debemos incorporar el siguiente código dentro de las etiquetas <head> y </head>:
<html>
<head>
<title>Título</title>
<div ID="waitDiv" style="position:absolute;left:300;top:300;visibili ty:hidden">
<table cellpadding="6" cellspacing="0" border="1" bgcolor="#000000" bordercolor="#FFFFFF">
<tr><td align=center>
<font color="#ffffff" face="Verdana" size="4">Cargando página...</font>
<img src="/images/cargando.gif" border="1">
</td>
</tr></table>
</div>
<SCRIPT>
<!--
var DHTML = (document.getElementById || document.all || document.layers);
function ap_getObj(name) {
if (document.getElementById)
{ return document.getElementById(name).style; }
else if (document.all)
{ return document.all[name].style; }
else if (document.layers)
{ return document.layers[name]; }
}
function ap_showWaitMessage(div,flag) {
if (!DHTML) return;
var x = ap_getObj(div); x.visibility = (flag) ? 'visible':'hidden'
if(! document.getElementById) if(document.layers) x.left=280/2; return true; } ap_showWaitMessage('waitDiv', 3);
//-->
</SCRIPT>
</head>
<body>
Cuerpo del sitio
</body>
<SCRIPT language=javascript>
<!--
ap_showWaitMessage('waitDiv', 0);
//-->
</SCRIPT>
</html>