Uiloader button issue

1

I have a uiloader component that loads in images, there’s a back button and a next button. Im trying to hide the back button when the user is viewing image number 1. The problem is when the site loads the back button is visible even though the source is image 1. If you cycle through the images to image 1 then it disappears?? why?

heres my code for my imageloader:

next_but.addEventListener(MouseEvent.CLICK, nextimage);

var ImageNumber:Number = 1;

function checkNumber():void {
back_but.visible = true;
next_but.visible = true;
if (ImageNumber==1){
back_but.visible = false;
}
if (ImageNumber==10){
next_but.visible = false;
}

}

function nextimage(evtObj:MouseEvent):void
{

          ImageNumber++;
          fullImageLoader.source ="Gallery/full/"+ImageNumber+".jpg";
  checkNumber();

}

back_but.addEventListener(MouseEvent.CLICK, backimage);

function backimage(evtObj:MouseEvent):void
{

          ImageNumber--;
          fullImageLoader.source ="Gallery/full/"+ImageNumber+".jpg";
  checkNumber();

}

fullImageLoader.addEventListener(Event.COMPLETE, imageloaded);
function imageloaded(event:Event) {

new Tween ( fullImageLoader ,“rotationX”,Elastic.easeOut ,90,0,1,true);
}