Load image in IE

Load image in IE

I'm trying to use load function to get images sizes once they have been loaded.  It works in all other browsers, but trying to get it to work in IE10+.  The load function is just failing silently in IE.  I did see some talk about assigning a date to the src, but it warns against using this for files hosted on CDNs, which this will be.  So can you show me how to fix this & play nice w/ CDNs ?

  1. $(document).ready(function() {
  2.   var myz = 100;
  3.   $('div[id^="myimgdiv"]').find('img').each(function() {
  4.     $(this).load(function() {
  5.       var oimgwd = $(this)[0].naturalWidth;
  6.       var mwd = Math.round(oimgwd * %id=maxwd% / 100);
  7.       $(this).css({'z-index': myz, 'width': mwd + 'px'});
  8.       myz--;
  9.     });
  10.   });
  11. });

UPDATE:  I just tried this and it seems to be working - don't really know why, maybe someone could explain why it works ;)

  1. $(document).ready(function() {
  2.   var myz = 100;
  3.   $('div[id^="myimgdiv"]').find('img').each(function() {
  4.     if ($(this).height() > 0) { // non IE
  5.       var oimgwd = $(this)[0].naturalWidth;
  6.       var mwd = Math.round(oimgwd * %id=maxwd% / 100);
  7.       $(this).css({'z-index': myz, 'width': mwd + 'px'});
  8.       myz--;
  9.       $(this).fadeIn(600);
  10.     }
  11.     else {  // for IE
  12.       $(this).load(function() {
  13.         var oimgwd = $(this)[0].naturalWidth;
  14.         var mwd = Math.round(oimgwd * %id=maxwd% / 100);
  15.         $(this).css({'z-index': myz, 'width': mwd + 'px'});
  16.         myz--;
  17.         $(this).fadeIn(600);
  18.       });
  19.     }  
  20.   });

Thanks.