La opción de Alexis es más profesional que la que te voy a proponer yo
Pero por si te sirve:
El div es:
Cita: <div id="loadPage">
<p>
<img src="images/load.gif" /><br />
Cargando...
</p>
</div>
El css:
Cita: /* PAGINA DE CARGA */
#loadPage{
display: block;
background: #333;
color: white;
width: 100%;
height: 100%;
position: fixed;
top: 0px;
left: 0px;
z-index: 1000;
}
#loadPage p {
display: block;
width: 100px;
height: 30px;
font-size: 30px;
position: absolute;
top: 0px;
left: 0px;
bottom: 0px;
right: 0px;
margin: auto;
}
#loadPage img {
width: 80px;
height: 80px;
}
/* FIN DE PAGINA DE CARGA */
Y el js, que controla que sea cuando se carga la pagina.
Cita: ///////////////
// Load Page //
///////////////
/** PAGINA DE CARGA **/
$(window).load(function(){
$("#loadPage").delay(1000).fadeOut("slow");
});
// FIN PAGINA CARGA
Edito: Si lo que quieres es poner un fondo en grande, puedes ponerlo de background en el css, y en el div, quitas el contenido (eliminando a la par el css correspondiente a lo que elimines, para que no te quede código que no se usa)
Espero haber sido de ayuda.
Un saludo.