Ciao a tutti, sto realizzando un sito piuttosto pesante con uno scrolling in ajax che funziona bene solo se tutta la pagina è stata caricata completamente. Vorrei chiedere se è possibile fare un loading dell'intera pagina in Javascript o altro, che visualizzi un immagine di caricamento finchè tutto il sito non è pronto.

Io ho fatto un esperimento decisamente semplice:

Ho div che contiene l'immagine con la scritta loading:

<div id="wait">
[img]images/loading/ajax-loader.gif[/img]>
</div>
Nel body ONLOAD faccio partire la funzione che nasconde il Div quando la pagina è caricata:

<body onload="nascondi();">
La funzione è questa:

<script language="javascript">
function nascondi() {
document.getElementById("wait").style.visibility = 'hidden';
};
</script>
Sembra funzionare perchè il div di caricamento resta 5-6 secondi online (e 1 offline) e poi scompare.
In realtà noto che la pagina non ha finito di caricarsi quando il div scompare, quindi il loading non funziona.

Per chi volesse vedere il codice, il sito che sto realizzando è questo:

Versione senza load
(funziona lo scrolling delle pagine, ma solo quando è completamente caricato il sito):
http://www.imaybestupid.com/new/

Versione con il mio loader primitivo
(non funziona mai lo scrolling delle pagine e il loading finisce prima del caricamento):
http://www.imaybestupid.com/newloading/


Avete qualche suggerimento per migliorare il loader, oppure qualche alternativa più pratica per fare una cosa del genere?? Ovviamente deve essere crossbrowser!!
Grazie a chi vorrà aiutarmi!
Luca