Código HTML:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Cargador</title>
</head>
<body>
<script language="JavaScript">
var isIE = false
var isNav = false
var isOpera = false
var isOther = false
isIE=navigator.appVersion.indexOf("MSIE")>0?true:false;
isNav=navigator.appName=="Netscape"?true:false;
isOpera=navigator.appName=="Opera"?true:false;
if(!isIE&&!isNav&&!isOpera){isOther=true}
function checkLoadStatus(){
var preload=document.images.length
var i=0;
var iCounter=0;
while(i < preload){
if(document.images[i].complete||document.images[i].complete=="loaded"||document.images[i].complete==true||document.images[i].complete=="true"||document.images[i].complete=="done"){
iCounter++
}
i++
}
document.getElementById("_loaded").innerText = parseInt(iCounter/preload*100)+"%";
if(isIE||isOpera){document.all._red.style.width=parseInt(iCounter/preload*279)}
else{document.getElementById("_red").style.width=parseInt(iCounter/preload*279)}
if(iCounter<preload){
var timeoutID = setTimeout("checkLoadStatus()",50)
} else{
document.getElementById("FullContent").style.visibility = "visible";
document.getElementById("container").style.visibility = "hidden";
}
}
function CanelarCarga() {
document.getElementById("FullContent").style.visibility = "visible";
document.getElementById("container").style.visibility = "hidden";
}
</script>
<div id="FullContent" style="visibility:hidden;">
tu contenido HTML aqui
</div>
<div id="container" style="position:absolute; width:315px; height:325px; z-index:999;">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="315" height="310">
<param name="movie" value="cargador.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<embed src="cargador.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="315" height="310"></embed>
</object>
<table align="center" height="10" border="0" cellspacing="0" cellpadding="0" class="TablaSimple" style="color:#FFFFFF;">
<tr>
<td width="300" style="border:1px solid #FFFFFF;"><div ID="_red" style="width:0px; height:8px; z-index:10; overflow:hidden; background-color:#F0C805; margin:1px;"></div></td>
<td style="padding-left:4px;"><div id="_loaded" style="font-weight:bold; color:#FFFFFF; font-size:10px;">0%</div></td>
</tr>
<tr>
<td height="25" colspan="2" align="center" style="font-size:10px">Si la página no carga completamente, presione la tecla F5</td>
</tr>
<tr>
<td height="30" colspan="2" align="center"><input type="button" value="Cancelar Carga" class="Botones" onclick="CanelarCarga()"/></td>
</tr>
</table>
</div>
<script language="javascript">checkLoadStatus();</script>
</body>
</html>
el cargador.swf es un movie en flash simulando el loading... puedes colocar tu logo y colocar la palabra cargando. es todo, lo demas es simple.
saludos
