AS3 Centering and Resizing a background in existing code

[mtjones]

I have a code for a page I am using and I would like to add a background and have it resize with the screen like the rest of the page. I have created a movie button named "pic" with the image in it but I don't know how to write the code and place it in the existing AS3 code file. Could someone please help. I am brand new to this so if someone could tell me how to place the code like i was in 3rd grade, that would be great. Here is the existing code.

package com.modules
{
import flash.display.*;
import flash.events.*;
import flash.net.*;
import flash.text.*;
import caurina.transitions.Tweener;
import com.utils.*;



public class About extends Sprite
{
private var content_height:int;
private var content_width:int;
private var marginTop:int;
private var marginBottom:int;
private var content_y:int;

private var _content:Content;
private var news:News;
private var array:Array;

private var pan:Panning;

public function About()
{
// listen for when this is added to stage
this.addEventListener(Event.ADDED_TO_STAGE, ini);
// listen for when this is removed from stage
this.addEventListener(Event.REMOVED_FROM_STAGE, remove);
}

private function ini(e:Event)
{
stage.addEventListener(Event.ADDED, onStageResize);
stage.addEventListener(Event.RESIZE, onStageResize);

content_y = int(GlobalVarContainer.vars.CONTENT_Y);

_content = new Content;
addChild(_content);
_content.visible=false;

// load xml
if((GlobalVarContainer.vars.XML_PATH!="") && (GlobalVarContainer.vars.XML_PATH!=undefined))
{
var loadXml:LoadXml;
loadXml = new LoadXml(GlobalVarContainer.vars.XML_PATH);
loadXml.addEventListener(Event.COMPLETE, onXmlComplete);
}
}


private function onXmlComplete(e:Event)
{
// set up content
content_width = e.target.returnData.attribute("width");
marginTop = e.target.returnData.attribute("marginTop");
marginBottom = e.target.returnData.attribute("marginBottom");
var backgroundColor = e.target.returnData.attribute("backgroundColor");
Tweener.addTween(_content.bg, {_color:backgroundColor, time:.1, transition:"linear"});

_content.bg.width = content_width;
_content.masc.area.width = (content_width -_content.masc.x)-20;
_content.holder.txt.width = _content.masc.area.width -10;

// write text
_content.holder.txt.mouseWheelEnabled = false;
_content.holder.txt.styleSheet = GlobalVarContainer.vars.CSS;
_content.holder.txt.condenseWhite = true;
_content.holder.txt.htmlText = e.target.returnData;
_content.holder.txt.autoSize = TextFieldAutoSize.LEFT;

onStageResize();
_content.visible=true;

// create new Panning instance;
pan = new Panning(_content.holder, _content.masc, _content.bg, 4, true);
pan.addEventListener(Event.ADDED, scInit);
addChild(pan);

}

// Initialize panning
function scInit(e:Event):void
{
pan.init();
}


// resize contents
private function onStageResize(e:Event = null):void
{
resizeContent((stage.stageHeight - ((content_y + marginTop) + int(GlobalVarContainer.vars.BOTTOM_SHAPE_H)))-marginBottom);
}

private function resizeContent(height_:int):void
{
content_height = height_;
_content.bg.height = content_height;
_content.masc.area.height = (content_height -_content.masc.y)-20;
_content.holder.mask = _content.masc;

Tweener.addTween(_content, {x: Math.round(stage.stageWidth/2 - _content.width/2) , time:.5, transition:"linear"});
_content.y=content_y+ marginTop;
}

// used to change colors. here we not use
public function changeTheme():void
{
}


// remove listeners, images and unload panning;
function remove(event: Event) : void
{
pan.unload();
stage.removeEventListener(Event.ADDED, onStageResize);
stage.removeEventListener(Event.RESIZE, onStageResize);
this.removeEventListener(Event.ADDED_TO_STAGE, ini);
this.removeEventListener(Event.REMOVED_FROM_STAGE, remove);

trace("remove about");
}

}
}

[nike22]

It's rather awesome,I have been searching materials relate to these stuffs for my paper.and it really helps me.