Div nimmt neue Positions-Werte erst nach darstellen an

[slide]

Hallo,
ich baue gerade eine kleine "Lightbox". Also so, dass bei klick auf ein Bild ein bis dahin verstecktes div aufgeht und darin das Bild in groß erscheint.

Das funktioniert vom Prinzip her auch ziemlich gut, nur ein Problem habe ich.

Ich lege zuerst die Größe des Divs und dessen Position fest(dies funktioniert auch):

document.getElementById("imagelayer").style.top= document.body.offsetHeight/2 - loadimg.height/2 + "px" ;
document.getElementById("imagelayer").style.left= document.body.offsetWidth/2 - loadimg.width/2 + "px" ;
document.getElementById("imagelayer").style.height= loadimg.height + "px" ;
document.getElementById("imagelayer").style.width= loadimg.width + "px" ;

Danach Zeige ich alle Divs an:

document.getElementById("imagelayer").style.display= "block";
document.getElementById("bglayer").style.display="block";

Allerdings werden die Divs erst so angezeigt, dass die obere linke ecke der divs in der mitte des browsers ist, ebenso stimmt die breite und höhe nicht.
Dann schnappen die divs auf die richtige Position. Selbst wenn ich die beiden Teile trenne und mit setTimeout eine Zeitverzögerung einbaue,
verhält es sich immernoch so.

Das Verhalten ist im Firefox und IE gleich.