Incorrect behavior of Google Chrome when calculating image width. How to fix?

Question

JavaScript

Actually a subject.
I 'm using the latest version of jQuery, the page has an image and there is a code like: Only this code works somehow crookedly in Google Chrome (latest version), while in other browsers everything works okay. What is inoperability? I write something like console.log(width), reload the page, "0" falls into the console. I reboot with F5, no result. However, if you place the cursor exactly in the address bar and press Enter, everything magically starts working right there, i.e. the value I need appears in the console. But if you press F5 again, the result is reset again. What nonsense? How to fix? And why only Chrome suffers? Even IE7 works correctly.

var width = $('img').width();<br>

Answer 1

In document.ready, images may not be loaded, perhaps when they are not in the cache, you see 0.
Try:

var img_width = 0;
$(window).load(function() {
    img_width+=$('img').width();
});

Answer 2

Arrrrr!
In general, note to all interested: read the difference between $(document).ready and $(window).load

Answer 3

Have you tried wrapping it in onload?

Answer 4

Because the image hasn't loaded yet.
function imageWidth(){
return $('img').width();
}
<img src="http://example.net/picture.jpg" />
var img = new Image();
img.src = " example.net/picture.jpg";
img.onload = imageWidth;