Menu
I have to read each images' natural height and I should make calculations. However I have some problem with read to natural height.
$('div.imgkirp img').each(function(){ console.log($(this).naturalHeight); }); It gets : (images number) undefined in console log. How can i read each of images' natural height ?
850
width(); alert(imageWidth); var imageHeight = Imgsize. height();
Answer: Use the JavaScript clientWidth property You can simply use the JavaScript clientWidth property to get the current width and height of an image. This property will round the value to an integer.
You can get the original width and height of an image using the HTML5 image naturalWidth and naturalHeight properties, which are supported in almost all major browsers. To get the current width and height, you can use the JavaScript clientWidth and clientHeight properties.
If you're using the jQuery library, you can programmatically load the image from the web and get its dimensions. The idea is to dynamically create an image element and use the . attr() method to set its src attribute to the image URL. Once the image is available, you can get its width and height properties.
Try to use property naturalHeight of image, using the prop method of the jQuery
$('div.imgkirp img').each(function(){ console.log($(this).prop('naturalHeight')); }); 
var image = new Image(); image.src = $(this).attr("src"); alert('width: ' + image.naturalWidth + ' and height: ' + image.naturalHeight); This approach doesn't work in IE 8 and below versions, because it doesn't support 'naturalWidth' and 'naturalHeight' properties. To achieve the same use this code
var image = new Image(); image.src = $(this).attr("src"); image.onload = function() { console.log('height: ' + this.height); }; If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
