Preload images

[Manuelandro]

Ciao ragazzi.
allora, ho una pagina del mio sito ricca di immagini. Per evitare che ci metta tempo per caricarsi tutto o cmq per "costruirsi" la pagina formata da immagini, uso lo script preload imgs nella pagina precedente in modo che le immagini vengano caricate prima, e la visualizzazione di quella successiva sia quasi istantaneo. Ho provato a fare un test svuotando le cache, e passando dalla prima pagina per poi arrivare alla seconda (con le immagini) Risultato: le immagini non sembrano per caricarsi infatti la pagina cmq si costruisce piano piano caricando le immagini. come mai?
premetto che cmq le immagini sono molte ma tutte gif leggeressime, quindi non è poi questo gran problema.

cmq lo script che uso è questo...

<script type="text/javascript">
//precaricamento imgs
preloadImgs('img/bottoni/left/_rosso-bar.gif', 'img/bottoni/left/_rosso.gif',
.....
....

thx come sempre

[Xinod]

- molte... quante?
al di la' del peso ogni immagine e' un file, che per quanto gia' in cache genera comunque un minimo rallentamento in fase di rendering, se per es. fossero 100 avvertiresti questo rallentamento
La norma dice che spezzare un' immagine molto grande in moltissime immagini piccole non e' una buona idea.

- preloadImgs
posta cosa c'e' nella funzione preloadImgs, in pratica fai solo capire che la richiami
al 99% fa il suo dovere ma meglio verificare

- hai tecniche che forzano il browser a richiedere sempre la pagina dal server e a non ripescarla dalla cache (nella fattispecie meta o opportuni header inviati lato server)?
qui il browser potrebbe decidere di non ripescare dalla cache anche file dipendenti al documento

- testi con IE? quale versione?
nel caso del 6 verifica quale dei 4 radio delle impostazioni di cache dei file temporanei di internet e' segnato

ciao

[H5N1_Aviaria]

L'uso di Javascript per il precaricamento delle immagini è sconsigliabile per via del fatto che alcuni browser (come Firefox) se ne infischiano!
Il modo migliore è utilizzare una DIV invisibile in cui inserire le immagini.

<DIV id="preload">
[img]images/immagine1.gif[/img]
[img]images/immagine2.gif[/img]
[img]images/immagine3.gif[/img]
</DIV>

il corrispondente CSS sarà:

#preload{height: 0;width: 0;border: 0;line-height : 0px;}
#preload img{height: 0; width: 0; border: 0;position: absolute;bottom: 0;left: 0;z-index: -30;visibility : hidden;}

Crossbrowsing garantito!
Testato con Firefox 2, Opera, IE 6

[sidvizioso]

aggiungo che per avere una corretta "non" visualizzazione del div "preload" in IE6 bisogna agginugere "display: none" a #preload.

[H5N1_Aviaria]

Errato modo di affrontare un giusto problema.
display : none = non visualizzare
il che significa che le immagini non verrebbero precaricate.
Piuttosto bisognerebbe utilizzare
#preload{
width : 0;
height : 0;
line-height : 0;
position : absolute;
}

[sidvizioso]

chiedo venia, la tua risposta è perfetta