title: jQuery getting image width/height loaded within a container
body: <p>I'm working with a plugin that requires me to get the width and height of the image, after it's loaded, regardless of how the dimensions of the image were determined.</p>
  
  <pre><code>&lt;img src=".." width="500" height="500" /&gt;                &lt;!-- works fine --&gt;
  &lt;img src=".." style="width: 500px; height: 500px;" /&gt;    &lt;!-- works fine --&gt;
  &lt;img src=".." width="500" /&gt;                             &lt;!-- only gives me width --&gt;
  &lt;img src=".." style="width: 500px;" /&gt;                   &lt;!-- only gives me width --&gt;
  &lt;img src=".." style="width: 500px; height: auto;" /&gt;     &lt;!-- only gives me width --&gt;
  &lt;img src=".." /&gt;                                         &lt;!-- doesn't work at all --&gt;
  </code></pre>
  
  <p>I have tried loading the image and getting its dimensions after but i've only been able to get the image's actual size and not the size at which it is display on the page.</p>
  
  <p>The code im using to get the width/height:</p>
  
  <pre><code>img.innerWidth();
  </code></pre>
  
  <p>I Have also tried:</p>
  
  <pre><code>$('&lt;img/&gt;').hide().attr('src',img.src).load(function() {
      img.Owidth = $(this).width();
      img.Oheight = $(this).height();
  }).appendTo($('body'));
  </code></pre>
  
  <p>And:</p>
  
  <pre><code>$("&lt;img/&gt;").attr("src", img.attr("src")).load(function() {
     img.width = this.width;
     img.height = this.height;
  });
  </code></pre>
  
  <p>Which do a fine job at getting me the original size of the image, but not the size of when it's loaded and displayed.</p>