How to get natural size of an image referenced in <input type=“image” … > in javascript

Question

I have an input of type "image" on my web page. I want to get dimensions of that original image (not the DOM element). How to do it in javascript?

The only solution I know is to get value of the src attribute, load image manually and get its size as described here . But I know image is already loaded, since it is displayed on the page.

Answer 1

Once you have no additional styles on that <input type="image" , you may use clientWidth/clientHeight the same as for img tag (by default, button will have the same width/height as src image). Unfortunately none of browsers support naturalWidth/naturalHeight for input of type image. Demo

At the same time - I see no big problem with using additional img element to get width/height of an image. In most cases image will be taken from cache.