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.