posso controllare il completo caricamento di un'immagine, presente in una pagina html solo come background di un div?
se magari è definito in un foglio di stile, mi sà che è un pò difficile...(xò nn ne sono sicuro)..
oppure controllarne il caricamento senza avere l'immaigne nella pagina, ma solo nello script js.
Certo...
io ho fatto una cosa simile, ho un div con una scritta "Caricamento in corso", mi carico le immagini trammite js e poi quando le ho caricate tutte, le faccio apparire con effetto fade-in..
Cmq nel tuo caso devi soltanto cambiare i parametri della funzione, invece che partire da 0 a 100, da 100 a 0, in modo che scompaia il div.
Le due funzioni per far scomparire il tuo div con effetto fade-out:
codice:
/* Parametri: id:id del tag che vuoi far appparire
opacStart: opacità iniziale (nel tuo caso 100)
opacEnd: opacità finale (nel tuo caso 0)
sec: durata dell'effetto
*/
// Cambio Opacità
function opacity(id, opacStart, opacEnd, sec) {
//calcolo la velocità di aggiornamento
var speed = Math.round(sec*10);
var timer = 0;
//determino la direzione del cambio
if(opacStart > opacEnd) {
for(i = opacStart; i >= opacEnd; i--) {
setTimeout("changeOpac(" + i + ",'" + id + "')",(timer*speed));
timer++;}
} else if(opacStart < opacEnd) {
for(i = opacStart; i <= opacEnd; i++){
setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
timer++;}
}
}
//cambio dei parametri di opacità per i diversi browser
function changeOpac(opacity, id) {
var object = document.getElementById(id).style;
object.opacity = (opacity / 100);
object.MozOpacity = (opacity / 100);
object.KhtmlOpacity = (opacity / 100);
object.filter = "alpha(opacity=" + opacity + ")";
}
naturalmente prima devi gestire il caricamento dell'immagine:
codice:
var t=new Image();
t.src='tuaImmagine.jpg';
t.onload=function(){opacity('idDelDiv',100,0,7000);}