javascript - Scale down image to fit div -


i trying scale down inage fit div container greater max width , heights set. have code below gets width , height of image , sets max sizes allowed.

this i'm out of depth, image loads below 662x599. width greater the max allowed need scale down correctly , placed center of div.

var max_width = 713; var max_height = 550;  var img = new image(); img.onload = function() {     img.width = this.width;     img.height = this.height; } img.src = 'files.jpg'; 

below example me resizing image manually looks give rough example of how should should. intent use styles "top" , "left" place image in center of div.

<img style="width: 613px; height: 550px; top: 0px; left: 50px;" src="files.jpg"> 

any great thanks.

this code calculate width, height, top, left.

// max_width  = 713 // max_height = 550 // img.width  = 662 // img.height = 599  scale_width = max_width / img.width; scale_height = max_height / img.height;  scale = math.min(scale_width, scale_height);  width = img.width * scale;  // 608 height = img.height * scale;  // 550  left = (max_width - width)/2; // 52 top = (max_height - height)/2;  // 0 

Comments

Popular posts from this blog

SPSS keyboard combination alters encoding -

Add new record to the table by click on the button in Microsoft Access -

javascript - jQuery .height() return 0 when visible but non-0 when hidden -