Image object to read actual width of the image using JavaScript

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

Let us start with reading the naturalWidth of the image

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

Here i1 is the image object.

naturalWidth of an image object returns the actual width of the image irrespective of its change by any style property. By using width we will get value after any style or DHTML is applied.

Demo managing reseting to naturalWidth 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 naturalHeight of Image
Image Object

Subscribe to our YouTube Channel here

JavaScript image naturalWidth