Image Loading

[javascriptman19]

If I do

 

 

<img id="IMAGE2" src="" style="max-width: 200px; max-height: 300px;">document.getElementById("IMAGE2").src = 'test.jpg';imgheight = document.getElementById("IMAGE2").offsetHeight;

 

 

on img's with max-width / max-height attributes not ones with fixed height/width....

 

sometimes i get 0 and sometimes i get a number...

 

then i noticed if i set the image... then set a timeout for 300 miliseconds then the offsetHeight always gives a number... can someone explain this to me? is the code going on before the image gets resized by the browser causing there to be no height to return resulting with the 0?

[javascriptman19]

What are the steps the browser takes?

 

1. Download Image

2. Resize

3. Render

 

???

[Omirion]

to run something after the document is ready loading use the onload event.

window.onload= function (){
insert code here.
}

[javascriptman19]

I GOT IT!!!

 

with max/min height/widths... theres no pre-set height/width so u don't know it until the image fully downed/rendered... thats the problem...

 

i got a question though... as the image downloads does it render at the same time... or does it download in the background then render? and if so can u get the height/width settings if it downloaded but has rendered yet? even though its like a 1 second process