Buenas tardes,
en primer lugar gracias por las respuestas. Me he pasado la tarde intentando hacerlo por mi mismo buscando por internet y demás.
Os cuento. Lo que quiero es que mientras se cargan las miniaturas del album aparezca este gif
y que mientras dure el proceso de carga se atenue el fondo (poniendo debajo de este icono algún color grisaceo semitransparente), se bloquee el uso del ratón y las barras de desplazamiento y una vez cargado desaparezcan todos estos cambios.
El código que tengo hasta el momento es este:
Función Javascript para el evento ONLOAD del BODY
Código:
<script language="javascript">
<!--
function precargar() {
imgs = document.images;
precargadas = true;
for (var i = 0, total = imgs.length; i < total; i ++)
precargadas = (precargadas && imgs[i].complete);
if (precargadas){
document.body.style.visibility = "visible";
document.body.style.overflow = "";
document.getElementById("cargando").style.display='none';
}
else setTimeout("precargar()", 100);
}
//-->
</script>
Código HTML:
<body style="overflow:hidden" onLoad="precargar()" oncontextmenu="return false" bgcolor="#ff9900" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div id="cargando" style="position: absolute; top: 45%; left: 0%; height: 32px; width: 100%; text-align: center; line-height: 0; background: url(images/loading.gif) center no-repeat;">
<img align="center" src="images/cargando.gif" border="0">
</div>
Me falta bloquear el uso del ratón y establecer la atenuación del color de fondo.
Muchas gracias por vuestra ayuda. Un saludo.