[immagine] Caricare immagine

Printable View

20-06-2009, 14.47.47

[immagine] Caricare immagine

Salve a tutti!
Tramite i CSS ho dato un evvetto allo sfondo di alcuni div, che cambiano immagine di sfondo al passaggio del mouse. Ho provato con l'effeto slidedoor, ma alcuni browser interpretamo piuttosto mole il background position espresso in cordinate x-y.
Questo cambio di sfondo però causa un ritardo nella comparsa dell'immagine la prima volta, poco gradevole alla vista, c'è un modo per far caricare questa immagine anche se non ancora visualiazzata?
La faccio scaricare all'utente così poi la carica dalle cache e non da questo effetto di ritardo.

Vanno bene sia JS che php, preferibile quest'ultimo.

Grazie dell'aiuto

P.S.= L'effetto è dato ai link dei menù http://www.morgensterngdr.altervista.org/
20-06-2009, 16.29.27

ti consiglio di usare javascript: se applichi al body l'evento onload, gli fai caricare le immagini mentre carica tutta la pagina, così non incombi in effetti sgradevoli
20-06-2009, 17.23.50

arazz, mi serve caricare separatamente una singola immagine, che non è presente nella pagina finche l'utente non passa con il mouse sopra il div in questione, attivando l'evento hover.
20-06-2009, 17.39.50
alemoppo

Forse dico una cavolata, ma proverei a mettere l'immagine dentro un div nascosto (hidden o none ...{il CSS lo sapete meglio di me:wink:}).

Quindi, appena un utente apre la pagina, l'immagine (credo) viene caricata perché è dentro il div (che è nascosto)

Ciao!
20-06-2009, 17.44.07

secondo me basta fare omce ho detto io.. ho trovato questo codice suò web:
javascript:

Codice:

function na_preload_img() { var img_list = na_preload_img.arguments; if (document.preloadlist == null) document.preloadlist = new Array(); var top = document.preloadlist.length; for (var i=0; i < img_list.length-1; i++) { document.preloadlist[top+i] = new Image; document.preloadlist[top+i].src = img_list[i+1]; } }

e poi nell'html

Codice:

<BODY OnLoad="na_preload_img(false, 'immagine.jpg');">

Comunque anche come dice alemoppo funziona di sicuro: anche senza div, metti l'immagine infondo, le dai la classe .nascosta, e nei CSS scrivi:

.nascosta {
display: none
}
20-06-2009, 17.59.24

Proverò la soluzione di Alemoppo, se non funge tenterò con i Javascript.
20-06-2009, 18.05.08

si ti conviene fare così =)
20-06-2009, 18.27.45

Risolto mettendo un div vuoto ad altezza e larghezza 0, tutto ciò che è hidden fa inalberare i motori di ricerca, questo dovrebbe rendere le cose tranquille e funge, grazie alemoppo.