Load and unload image

I am working on a portfolio site,

i would like to create a custome class that I can plug into all my project buttons to load up a title.JPG and a img.JPG in there movieclip location.

I want to tween out current IMG and tween in new selected IMG. this is what I have started. I would like to make a custom class for this but im taking it one step at a time.


import caurina.transitions.Tweener;
//
var imageLoader:Loader;

function loadImage(url:String):void {
// Set properties on my Loader object
imageLoader = new Loader();
imageLoader.load(new URLRequest(url));
imageLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, imageLoading);
imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoaded);
}
function imageLoaded(e:Event):void {
// Load Image
imageArea.alpha = 0;
imageArea.addChild(imageLoader);
Tweener.addTween(imageArea, {alpha:1, time:0.5});
}

function imageLoading(e:ProgressEvent):void {
// Use it to get current download progress
// Hint: You could tie the values to a preloader :slight_smile:
}

//----------------------------------------------------------

worksBtn.addEventListener(MouseEvent.ROLL_OVER, worksOver);
worksBtn.addEventListener(MouseEvent.ROLL_OUT, worksOut);
worksBtn.addEventListener(MouseEvent.CLICK, worksClick);
worksNav.alpha = 0;

function worksOver(evt:MouseEvent) {
Tweener.addTween(worksBtn, {alpha:.5, time:1});
}

function worksOut(evt:MouseEvent) {
Tweener.addTween(worksBtn, {alpha:1, time:1});
}

function worksClick(evt:MouseEvent):void {
loadImage(“projects/3d/img/01.jpg”);
}

any help would be much appreciated.
Thanks