Hola xexyrita...
Estuve investigando en los dos post que respondi con respecto a lo que necesitas... respondi dos post diferentes que pienso que se pueden integrar para lograr un mejor resultado...
Por un lado tenemos este script...
<html>
<head>
<!-- PRIMER PASO: Copiar dentro del tag HEAD -->
<script language="JavaScript">
ns=document.layers
ie=document.all
function esconde() {
if (ie) precarga.style.visibility="hidden";
if(ns) document.pregarga.visibility="hide";
}
// -->
</script>
<style>
#precarga{position:absolute; width:100%; height:100%; top:0; left:0}
</style>
</head>
<body>
<!-- SEGUNDO PASO: Copiar dentro del tag BODY -->
<body onload="esconde();">
<script language="JavaScript">
if(ie || ns) document.write('<div id="precarga" align="center"><br><b>Cargando....</b><br>Por Favor Espere...!!!</div>');
</script>
</body>
</html>
Este script monta una Capa sobre el contenido de tu pagina que dice Cargando... Por Favor Espere..." luego que la pagina esta completamente cargada oculta la capa y muestra la pagina ya cargada....
Y Por otro lado tenemos este script
<html>
<head>
<title>Imagenes</title>
<script language="javascript 1.2">
<!--
var i;
var imagenes = new Array("imagen1.gif","imagen2.gif","imagen3.gif");
var lista_imagenes = new Array();
function cargarimagenes(){
for(i in imagenes){
lista_imagenes[i] = new Image();
lista_imagenes[i].src = imagenes[i];
}
}
</script>
</head>
<body>
<script>
cargarimagenes();
</script>
<img src="imagen1.gif"><br>
<img src="imagen2.gif"><br>
<img src="imagen3.gif"><br>
</body>
</html>
Que precarga tus imagenes mientras se carga tu pagina y no las muestra hasta que se cargen...
Puedes usar este ultimo si quieres pero si los integras lograrias algo mas profesional y como dices que el layout tiene muchas imagenes osea que pesa demasiado lo ideal seria integrarlo los dos para lograr un resultado pro.!!!
Podrias intentar con esto para ver que tal te va...
<html>
<head>
<script language="JavaScript">
ns=document.layers
ie=document.all
function esconde() {
if (ie) precarga.style.visibility="hidden";
if(ns) document.pregarga.visibility="hide";
}
// -->
</script>
<script language="javascript 1.2">
<!--
var i;
var imagenes = new Array("imagen1.gif","imagen2.gif","imagen3.gif");
var lista_imagenes = new Array();
function cargarimagenes(){
for(i in imagenes){
lista_imagenes[i] = new Image();
lista_imagenes[i].src = imagenes[i];
}
}
</script>
<style>
#precarga{position:absolute; width:100%; height:100%; top:0; left:0}
</style>
</head>
<body onload="esconde();">
<script language="JavaScript">
if(ie || ns) document.write('<div id="precarga" align="center"><br><b>Cargando....</b><br>Por Favor Espere...!!!</div>');
</script>
<script>
cargarimagenes();
</script>
<!--Estas imagenes son de ejemplo... no tienes que llamar a ninguna imagen porque se supone que ya las tienes en un layout listas y alineadas, solo lo puse como ejemplo....-->
<img src="imagen1.gif"><br>
<img src="imagen2.gif"><br>
<img src="imagen3.gif"><br>
</body>
</html>
Prueba este ultimo script tambien que une los 2 ultimos script a ver que tal te va...
Cualquier comentario no dudes en preguntar...
Saludos..
Cya...