title: How can I determine img width/height of dynamically loaded images in IE?
body: <p>My markup is a simple div element with id 'load'.  Using jQuery I then load a list of image elements into this div:</p>
  
  <pre><code>$('#load').load('images.html', { }, function() {
    $(this).onImagesLoad({
      selectorCallback: function() {
        ....do something....
      }
    });
  });
  </code></pre>
  
  <p>where images.html is a list like this:</p>
  
  <pre><code>&lt;img src='1.jpg' caption='img 1'&gt;
  &lt;img src='2.jpg' caption='img 2'&gt;
  ...
  </code></pre>
  
  <p>To ensure that all images are loaded completely, I use the <a href="http://plugins.jquery.com/project/onImagesLoad" rel="nofollow noreferrer">onImagesLoad</a> plugin.  This, so far, works just fine on all browsers.</p>
  
  <p>However, on IE8 (and I assume other versions of IE also) when I then iterate over the img elements, I am unable to determine the width/height of the images loaded.  The image.context.naturalWidth and naturalHeight attributes don't seem to work.</p>
  
  <p>How do I get a hold of the images' dimension?</p>
  
  <p>Thanks heaps :)</p>
  
  <p><strong>Update</strong></p>
  
  <p>@Simon: That didn't work on IE, and broke the other browsers as well.</p>
  
  <p>@Jenechka: If "imageDomElement" is just another name for the "image" variable in my example above, then it doesn't work. Or what do you mean by that DomElement?</p>