[Javascript] preload scriptje loopt oneindig uit..

[Verwijderd]

Hoi,
mijn html pagina bestaat uit een aantal thumbnails van foto's
en als je op één van die klikt wordt deze vergroot weergegeven in een tabel.
Nu wil ik niet dat wanneer er op een foto geklikt wordt dat men de foto ziet laden..
incl. achtergrond v/d tabel. Het moet vloeiend gebeuren,

daarom volgende programmastructuur:
=> laadlayer weergeven
=> doe x aantal keren blokje bij progressbar tot dat foto volledig geladen is
=> verberg laadlayer
=> foto weergeven

(ik waarschuw jullie op voorhand dat de code die hieronder staat misschien niet al te conform is met jullie programmeergewoontes, nu ja ik ben nog maar een javascript beginner )

Ik moet dus nagaan of de afbeelding wel degelijk volledig geladen is dus
daarvoor gebruik ik:
object.complete.
maar met while ( !(imgObjs[id].complete) );
belandt ik steevast in een oneindige lus..

Heeft iemand raad hoe ik dit kan nagaan of mijn afbeelding volledig geladen is?
Bedankt alvast voor je tijd.

code:

var imgObjs = new Array(20);
var barLayer = null;
var percentLayer = null;
var statLayer = null;

function ChangeBgImage( Img )
{
    var Src = new String( Img );
    var id = Src.charAt( Src.length - 5 )
    Src = "img/atel"+ id + ".jpg";
    startLoading(Src,id);
}


function getLayer(layerID) {
if (document.getElementById)
    return document.getElementById(layerID);
else if (document.all)
    return document.all[layerID];
else
    return null;
}


function updateBar(Src,id) {
    imgObjs[id] = new Image();
    imgObjs[id].onload;
    imgObjs[id].src = Src;
    var c = 1;
    if ( !(imgObjs[id].onerror))
    {
        //do{
        //  barLayer.style.width = (c*3) +"px";
        //  percentLayer.innerHTML = "<font color=\"#BBBB00"><B>"+c+"%</B></font>";
        //  if( c < 90)
        //      c += 3;
        //} while ( !(imgObjs[id].complete) );

    }
        
        barLayer.style.width = (100*3) +"px";
        percentLayer.innerHTML = "<font color=\"#BBBB00\"><B>100%</B></font>";
    if(imgObjs[id].complete)
    done(id);
}

function startLoading(Src,id) {

    if (document.getElementById || document.all)
    {
        barLayer = getLayer("bar");
        percentLayer = getLayer("percent");
        statLayer = getLayer("stat");
        updateBar(Src,id);
    }
}


function done(id) {
    bgimage.background = imgObjs[id].src;
}

[Thijsmans]

een functie maken die checkt of object.complete true is, en zoniet, een setTimeout naar dezelfde functie

code:

function objectComplete( obj ){
     if( document.images[obj].complete ){
          alert('\o/');
     } else {
          setTimeout("objectComplete("+obj+")", 10);
     }
}

hth

[Verwijderd]

ok thx voor je antwoord

[crisp]

een image heeft trouwens ook een onload event