About Kirupa's XML gallery with thumbnail tutorial

programming flash
1

Hi,

I want to put a background image to all thumbnails. So when the thumbnail is loaded it will have a beatiful frame.

Can somone guide me? How can I achieve this?

http://www.kirupa.com/developer/mx2004/thumbnails.htm

To make it more clear:

Currently the thumbnails are like this

But I want to load that picture into a movieclip which have a background picture inside so at the end I will achieve this

And here is the code:


 
function loadXML(loaded) {
 if (loaded) {
  xmlNode = this.firstChild;
  image = [];
  description = [];
  thumbnails = [];
  en = [];
  boy = [];
  yukseklik = [];
  seri = []
  model = []
  total = xmlNode.childNodes.length;
  for (i=0; i<total; i++) {
   image* = xmlNode.childNodes*.childNodes[0].firstChild.nodeValue;
   description* = xmlNode.childNodes*.childNodes[1].firstChild.nodeValue;
   thumbnails* = xmlNode.childNodes*.childNodes[2].firstChild.nodeValue;
   en* = xmlNode.childNodes*.childNodes[4].firstChild.nodeValue;
   boy* = xmlNode.childNodes*.childNodes[5].firstChild.nodeValue;
   yukseklik* = xmlNode.childNodes*.childNodes[6].firstChild.nodeValue;
   seri * = xmlNode.childNodes*.childNodes[7].firstChild.nodeValue;
   model * = xmlNode.childNodes*.childNodes[8].firstChild.nodeValue;
   thumbnails_fn(i);
  }
  firstImage();
 } else {
  content = "file not loaded!";
 }
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("images.xml");
///////////////////////////////////// 
listen = new Object();
listen.onKeyDown = function() {
 if (Key.getCode() == Key.LEFT) {
  prevImage();
 } else if (Key.getCode() == Key.RIGHT) {
  nextImage();
 }
};
Key.addListener(listen);
previous_btn.onRelease = function() {
 prevImage();
};
next_btn.onRelease = function() {
 nextImage();
};
///////////////////////////////////// 
p = 0;
this.onEnterFrame = function() {
 filesize = picture.getBytesTotal();
 loaded = picture.getBytesLoaded();
 preloader._visible = true;
 if (loaded != filesize) {
  preloader.preload_bar._xscale = 100*loaded/filesize;
 } else {
  preloader._visible = false;
  if (picture._alpha<100) {
   picture._alpha += 10;
  }
 }
};
function nextImage() {
 if (p<(total-1)) {
  p++;
  if (loaded == filesize) {
   picture._alpha = 0;
   picture.loadMovie(image[p], 1);
   desc_txt.text = description[p];
   en_txt.text = en[p];
   boy_txt.text = boy[p];
   yukseklik_txt.text = yukseklik[p];
   serimodel_txt.text = seri[p] + " " + model[p];
   picture_num();
  }
 }
}
function prevImage() {
 if (p>0) {
  p--;
  picture._alpha = 0;
  picture.loadMovie(image[p], 1);
  desc_txt.text = description[p];
  en_txt.text = en[p];
  boy_txt.text = boy[p];
  yukseklik_txt.text = yukseklik[p];
  serimodel_txt.text = seri[p] + " " + model[p];
  picture_num();
 }
}
function firstImage() {
 if (loaded == filesize) {
  picture._alpha = 0;
  picture.loadMovie(image[0], 1);
  desc_txt.text = description[0];
  en_txt.text = en[0];
  boy_txt.text = boy[0];
  yukseklik_txt.text = yukseklik[0];
  serimodel_txt.text = seri[0] + " " + model[0];
  picture_num();
 }
}
function picture_num() {
 current_pos = p+1;
 pos_txt.text = current_pos+" / "+total;
}
function thumbNailScroller() {
 // thumbnail code! 
 this.createEmptyMovieClip("tscroller", 1000);
 scroll_speed = 10;
 tscroller.onEnterFrame = function() {
  if ((this._ymouse>=thumbnail_mc._y) && (this<=thumbnail_mc._y+thumbnail_mc._height)) {
   if ((this._xmouse>=(hit_right._x-40)) && (thumbnail_mc.hitTest(hit_right))) {
    thumbnail_mc._x -= scroll_speed;
   } else if ((this._xmouse<=(hit_left._x+40)) && (thumbnail_mc.hitTest(hit_left))) {
    thumbnail_mc._x += scroll_speed;
   }
  } else {
   delete tscroller.onEnterFrame;
  }
 };
}
function thumbnails_fn(k) {
 thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
 tlistener = new Object();
 tlistener.onLoadInit = function(target_mc) {
  target_mc._x = hit_left._x+(target_mc._width+5)*k;
  target_mc.pictureValue = k;
  target_mc.onRelease = function() {
   p = this.pictureValue-1;
   nextImage();
  };
  target_mc.onRollOver = function() {
   this._alpha = 50;
   thumbNailScroller();
  };
  target_mc.onRollOut = function() {
   this._alpha = 100;
  };
 };
 image_mcl = new MovieClipLoader();
 image_mcl.addListener(tlistener);
 image_mcl.loadClip(thumbnails[k], "thumbnail_mc.t"+k);
}

Thanks a lot if someone can help.