Getting the height and width of an image whose
height attributes directly. However, if you try to get the dimensions of an image(normal or base64) that is dynamically loaded, you might get 0x0 value in return for width and height respectively.
I have prepared below example to demonstrate this
In the above example:
As we can see in console messages, the browser returned the width and height of the images whose source was already known however for the dynamically loaded images, it returned 0x0 as image dimension. Browser returns 0x0 value as the image is yet to be loaded.
To correctly calculate the dimensions of dynamically loaded image we should use the image
onload event which, will ensure the height gets calculated only after image is loaded.
Once we fix the issue, the browser will correctly communicate the dimension of the image back to us, as we can see in the screenshot below.