Scale images proportionally

Scale images proportionally

Hi all

I have a simple test site to test scaling images proportionally.

http://www.ttmt.org.uk/imgScale/


stage.scaleMode=StageScaleMode.NO_SCALE;
stage.align=StageAlign.TOP_LEFT;

var hh:Number=80;
var fh:Number=160;
var hfh:Number=240;

stage.addEventListener(Event.RESIZE, stage_resizeHandler);

function stage_resizeHandler(evt:Event):void {
	var sw:Number=stage.stageWidth;
	var sh:Number=stage.stageHeight;
	header_mc.width=body_mc.width=footer_mc.width=sw;
	body_mc.height=sh-hfh;
	footer_mc.y=sh-fh;
	//
	var w:Number=body_mc.img_mc.width;
	var h:Number=body_mc.img_mc.height;
	var r:Number=Math.round(w/h);
	//
	body_mc.img_mc.width = h*r
}

The site is full browser with 3 MovieClips - header_mc, body_mc and footer_mc.

header_mc is the strip across the top. body_mc is the middle section, which contains a image that is a MC, img_mc. footer_mc is the bottom strip.

When the browser resizes, header_mc and footer_mc stay the same height, but the height of body_mc will change and footer_mc sticks to it’s bottom.

When the window resizes I want the image to resize proportionally - that’s where I’m stuck

How can I resize the image to keep it’s proportion.