Clever Geek Handbook

Get the original dimensions of a modified html image element

Is there a simple and efficient way to get the true dimensions (in JavaScript) of an image that is rendered in an element <img>

with potentially different render sizes (e.g. via max-height

or max-width

)?

+3


source to share


1 answer


Attributes naturalWidth

and naturalHeight

DOM are present here .

For example:

var image = new Image();
image.src = "test.jpg";
image.onload = function() {
    alert('width - ' + image.naturalWidth);
    alert('height - ' + image.naturalHeight);
}


Or see an example on jsFiddle.

More information on MDN

+17


source






More articles:


All Articles