My markup is a simple div element with id 'load'. Using jQuery I then load a list of image elements into this div:

$('#load').load('images.html', { }, function() {
  $(this).onImagesLoad({
    selectorCallback: function() {
      ....do something....
    }
  });
});

where images.html is a list like this:

<img src='1.jpg' caption='img 1'>
<img src='2.jpg' caption='img 2'>
...

To ensure that all images are loaded completely, I use the onImagesLoad plugin. This, so far, works just fine on all browsers.

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.

How do I get a hold of the images' dimension?

Thanks heaps :)