Ajith
Ajith

Reputation: 2666

How to get scaled height of an image from known width of an html container?

I am facing a challenge on my html page to find the scaled height of an image in a container whose dynamic width is known

Let the width be var wid = 740; for desktop, it may vary based on screen size, but the value is know in some js function.

Suppose I have uploaded an image with size 600x591, It will scaled to the container with width 740, What i need is to dynamically find the scaled height value In the above example scaled height value is 729, The value known to me is orginal image size 600 x 591 and container width 740 (Here the image is upper scaled)

Another example is image with size 1170 x 574 This is scaled to 740 x 363 , So I need to find the value 363 dynamically from image resolution (1170 x 574) and container with 740

var wid    = document.getElementById('wrapid').offsetWidth; // wrapper width
var width  = imageWidth;
var height = imageHeight;
var hei    = 0; // this is for wrapper scaled height , need a calulation to find this

Note: The container with can vary based on screen size but it will be a constant.

Any help would be much appreciated, Thanks in advance

Upvotes: 0

Views: 119

Answers (1)

Ajith
Ajith

Reputation: 2666

Got a solution, which is added below

hei = Math.round( (wid*height) / width );

Upvotes: 0

Related Questions