Databases
StackOverflow2013
Postsdbo
POimg.width and img.height inside $(img).load() and/or img.onload=... return rubish values in IE8
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POimg.width and img.height inside $(img).load() and/or img.onload=... return rubish values in IE8
    text
    copied!<p>I know this topic is discussed a lot, but I could not find any solutions which would work for me. So, my code is roughly:</p> <pre><code> var img =me.images[curID] var f = function() { var i = $(img); img.onload = null; $(img).unbind('load'); var iH = img.height; /*works for Firefox, Safari, Opera, Chrome*/ var iW = img.width; if (jQuery.browser.msie) { /*nothing works*/ iH = i.width(); /* returns 0*/ iH = i.attr('height'); /*returns undefined*/ iH = img.height; /*returns wrong 120:30 px instead of 1000:410 */ /*once page is reloaded - everything is fine */ } } src = img.src; if ( (!img.complete) || (typeof img.naturalWidth != 'undefined' &amp;&amp; img.naturalWidth == 0) ) { /*WAIT FOR LOAD*/ img.src = ""; $(img).load(f); img.onload = f; img.src = src; } else { /*SHOW */ f.apply(img); } </code></pre> <p>What am I doing wrong?</p> <p>p/s/ the image is inside div which is faded, so I basically want to resize an image before fadeIn.</p> <p>EDIT1: some info on my arrays:</p> <pre><code>.... this.slides = this.slidesContainer.children(); this.n = this.slides.length; for (var i=0;i&lt;this.n;i++) { var im = this.slides.eq(i).find('img:first')[0]; var sr = im.src; this.images[i] = im; this.imagesSrc[i] = sr; } ... </code></pre> <p>EDIT2: I rewrote a code a little bit (added onload), so that now it fires everywhere (IE/FF/Opera/Safari/...) And the program flow (IE8) is the following:</p> <ol> <li>wait for load</li> <li>onload fired (if I comment it -- jQuery().load is fired).</li> <li>inside f(): img.width = 120, img.height = 30 (it seems it's not loaded. correct width/height are 1000x410)</li> </ol> <p>It's hard to say what triggers it, because it does not happen always, not even always when images are not cashed. But from time to time, I see those strange width/height.</p> <p>EDIT3: there are some solution on how to get image loaded (<a href="http://lucassmith.name/2008/11/is-my-image-loaded.html" rel="nofollow">here</a> and <a href="https://raw.github.com/peol/jquery.imgloaded/master/ahpi.imgload.js" rel="nofollow">here</a>), in one .onload is used, in another - .load, I use both, so that should be fine even though the code might not be optimal and very neat.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload