Hola otra vez:
Ese código es básico para una precarga, pero no muestra porcentaje de carga.
Te paso una página completa para que veas el efecto (en el ejemplo no se muestran las imágenes...
Código:
<html>
<head>
<title>
precarga de imagenes (con barra de progreso)
</title>
<script>
function precargar() {
var dibujos = new Array(precargar.arguments.length);
for (var i = 0; i < dibujos.length; i ++) {
dibujos[i] = new Image();
dibujos[i].src = precargar.arguments[i]
}
return dibujos;
}
function precargados(dibujos) {
var parciales = true;
for (var i = 0; i < dibujos.length; i ++)
parciales = (parciales && dibujos[i].complete);
return parciales;
}
function porciento(dibujos) {
var parciales = 0;
for (var i = 0; i < dibujos.length; i ++)
parciales += (dibujos[i].complete) ? 1 : 0;
return parseInt(100 * parciales / dibujos.length);
}
var imagenes;
function continuar() {
alert("Ok.");
}
function cargando() {
document.getElementById("estado").style.width = porciento(imagenes) + "%";
if (precargados(imagenes))
continuar();
else
setTimeout("cargando()", 100);
}
function ini() {
imagenes = new precargar(
"http://www.sucaricatura.com/2004/fotos/20040000.jpg",
"http://www.sucaricatura.com/2004/fotos/20040001.jpg",
"http://www.sucaricatura.com/2004/fotos/20040002.jpg",
"http://www.sucaricatura.com/2004/fotos/20040003.jpg",
"http://www.sucaricatura.com/2004/fotos/20040004.jpg",
"http://www.sucaricatura.com/2004/fotos/20040005.jpg",
"http://www.sucaricatura.com/2004/fotos/20040006.jpg",
"http://www.sucaricatura.com/2004/fotos/20040007.jpg",
"http://www.sucaricatura.com/2004/fotos/20040008.jpg"
);
cargando();
}
</script>
</head>
<body onload="ini()">
<div style="position:relative; width: 100px; height: 20px; border: 1px" >
<div style="position:absolute; top: 0; left: 0; width:100%; height: 100%; background-color: blue" >
</div>
<div id="estado"
style="position:absolute; top: 0; left: 0; width: 1%; height: 100%; background-color: aqua" >
</div>
</div>
</body>
</html>
Tienes que poner en continuar lo que quieras que se active después de precargar las imágenes.
Saludos
