How to add dimensions to dynamic img elements (Updated)

Posted by Mohammad on Stack Overflow See other posts from Stack Overflow or by Mohammad
Published on 2010-04-23T08:17:35Z Indexed on 2010/04/23 9:23 UTC
Read the original article Hit count: 195

Filed under:
|
|
|

I use a Json call to get a list of image addresses, then I add them individually to a div like this. Unfortunately the image dimension is not part of the Json information.

<div id="container">
   <img src="A.jpg" alt="" />
   <img src="B.jpg" alt="" />
   ...
</div>

Do any of you JQuery geniuses know of a code that would flawlessly and dynamically add the true Width and Height to each img element in the container as soon as each individual one is rendered?

I was thinking maybe the code could do a image width check width > 0 to evaluate when the image has actually been rendered, then fire. But I wouldn't know how to go about that and make it work stably. How is the best way of going about this?

Thank you so much!

Update, As the answers point out, adding Width or Height to the elements is pretty routine. The problem here is actually writing a code that would know when to do that. And evaluate that condition for each image not the page as a whole.

© Stack Overflow or respective owner

Related posts about dom

Related posts about jQuery