Hi, i've been trying to figure this out all morning with no luck, i'm trying to create a site that can dynamically resize elements depending on the size of the browser, or if someone drags and resizes the window displaying the page.

The problem i'm having right now though is getting a background image to resize while keeping it's aspect ratio, here is my code:

Stage.align = "TL";
Stage.scaleMode = "noScale";

//Site content
stretch_bar._width = Stage.width;


//Define the role of the listener
sizeListener = new Object();
sizeListener.onResize = function(){
	//Get the new dimensions of the stage:
	var stageWidth:Number = Math.round(Stage.width);
	var stageHeight:Number = Math.round(Stage.height);
		trace ("stage size is now " + Stage.width + " px by " + Stage.height + " px");

	[B]//This is what is giving me the trouble, but i don't know what i'm doing wrong[/B]
	var aspectratio = Stage.width/Stage.height;
	photo_01._yscale = aspectratio * photo_01._xscale;
	
	stretch_bar._width = Stage.width;	
}

Stage.addListener(sizeListener);

I've used google to try find an answer and got pretty close, however all that happens is that when the window is dragged down the photo squashes upwards and when the window is dragged up the photo stretches down past the end of the window :confused:

Does anyone know what i am doing wrong?

You need to calculate the aspect ratio from the original image sizes, not the sizes of the strechable container.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.