JSFiddle - React, Tailwind, and code Playground
HTML
<div class="imgCon">
<img src="http://www.hurriyet.com.tr/_np/7203/17287203.jpg" />
</div>
CSS
img { width:0px; height:0px; }
JavaScript
console.log($('.imgCon img').height());//returns 0
var img = $('.imgCon img')[0]; // Get my img elem
var pic_real_width, pic_real_height;
$('<img/>') // Make in memory copy of image to avoid css issues
.attr('src', $(img).attr('src'))
.load(function() {
pic_real_width = this.width; // Note: $(this).width() will not
pic_real_height = this.height; // work for in memory images.
console.log( pic_real_width + 'x' + pic_real_height );
//returns undefined
// need to return this as an global variable 570x320
});
console.log( pic_real_width + 'x' + pic_real_height );
//returns undefined
// can't use this as an global variable