Loaded images appear wierd!

1

Hi i am currently working a website and i have some images that are loading in but when they load in they look completely wrong, i have programed the site so that the menu images for each menu item will vary each tim eit it loaded. the picture below is what the menu items should look like:

and here is what it actually looks like:

and this is the code for that section:

stop();

var thumbPathVar:String;//variable to store the thumbnail locations
ranImage = Math.floor(Math.random()*3) + ".jpg";

var loadedImage:Loader = new Loader();
var imageURLRequest:URLRequest = new URLRequest(thumbPathVar + ranImage);

loadedImage.load(imageURLRequest);
loadedImage.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoaded);

function imageLoaded(event:Event):void {


    loadingTarget.addChild(loadedImage.content);//this tells the site were to load the thumbnail
    

}


//the code below sets the roll over effect for the buttons
invisBttn.addEventListener(MouseEvent.MOUSE_OVER, overButton);// this listens for a mouse over event by the name overButton
invisBttn.addEventListener(MouseEvent.MOUSE_OUT, outButton);// this listens for a mouse over event by the name outButton

function overButton(event:MouseEvent):void{
    invisBttn.gotoAndStop(2);
}
function outButton(event:MouseEvent):void{
    invisBttn.gotoAndStop(1);
}