naturalHeight to get actual height of an image using Image object in JavaScript

<img src=../images/top2.jpg  align='right' id=my_image >

Let us start with reading the naturalHeight of the image

var y=document.getElementById("i1").naturalHeight;

Here i1 is the image object.

naturalHeight of an image object returns the actual height of the image irrespective of its change by any style property. By using height we will get value after any style or DHTML is applied.
Demo of getting naturalHeight of image.
Demo of changing height and width of image.
Demo of resetting to naturalHeight and naturalWidth of image.
Here is the code.

document.getElementById("i1").width=document.getElementById("i1").naturalWidth;
document.getElementById("i1").height=document.getElementById("i1").naturalHeight;

Reading naturalWidth of Image
Image Object

Subscribe to our YouTube Channel here

JavaScript image naturalHeight

Subscribe