We help IT Professionals succeed at work.

Centering Flash movies and full screen

kwood79
kwood79 asked
on
Hello and thanks in advance for any help you can provide. I'm an AS novice and usually can find what I need on the web and am able to hack code enough to accomplish my objective. But I'm stuck on my current problem. Here is what I'm trying to accomplish...

I have two movie clips in my Flash file. One called "mc_bg" and one called "tempMC". tempMC sits on the layer above mc_bg.

When published, I want tempMC to center in the browser and remain centered (no scale - stay at 100%) when the browser is resized. However, I want mc_bg to remain centered, but I do want it to scale or go full screen in the background. Basically stretch proportionately, edge-to-edge in the browser.

I am able to accomplish what I want with tempMC, but not with mc_bg. These are my publish settings when creating my HTML file and my AS code is below.

Dimensions: Percent. Width 100% x Height 100%
Scale: No Scale
Flash alignment: Horizontal: Left   Vertical: Top
tempMC._x = Stage.width / 2;
tempMC._y = Stage.height / 2;

mc_bg._x = Stage.height / 2;
mc_bg._y = Stage.height / 2;



var stageL:Object = new Object();
stageL.onResize = function() {
	tempMC._x = Stage.width / 2;
	tempMC._y = Stage.height / 2;
	mc_bg._x = Stage.height / 2;
	mc_bg._y = Stage.height / 2;
}

Stage.addListener(stageL);

Open in new window

Comment
Watch Question

Commented:
if you want mc_bg to fill the window, you don't want to set it's _x and _y.  the attached snippet will do what you described
function position(){
	tempMC._x = Stage.width / 2;
	tempMC._y = Stage.height / 2;
	mc_bg._width = Stage.width;
	mc_bg._height = Stage.height;
}

Stage.addListener({onResize:position});
position();

Open in new window

Author

Commented:
Thanks, but I actually tried that too. It works, but it warps (squishes/stretches) the movie mc_bg when you resize the browser.

Commented:
you said you wanted mc_bg to stretch from edge to edge...

"However, I want mc_bg to remain centered, but I do want it to scale or go full screen in the background. Basically stretch proportionately, edge-to-edge in the browser."

How do you want it to fill the window, but not scale?  Do you want like a tiled background?  If so, you'll need to construct your display object specifically to accomodate that behavior, e.g., with beginBitmapFill...

Author

Commented:
I want it to stretch, but proportionately. Not warp. So perhaps it scales to fit the width and the height adjust proportionately. Or vice versa. Does that make sense? Sorry if I'm not being clear.
Commented:
i understand now.

try this:
function position(){
	
	var w = Stage.width;
	var h = Stage.height;

	tempMC._x = w / 2;
	tempMC._y = h / 2;

	if(w > h){
		mc_bg._width = w;
		mc_bg._yscale = mc_bg._xscale;
	} else {
		mc_bg._height = h;
		mc_bg._xscale = mc_bg._yscale;
	}

}

Stage.addListener({onResize:position});
position();

Open in new window

Author

Commented:
that did it! thank you SO much!

Commented:
glad you got it working