Loading a image over thumbnails

Hey Everyone,

Please help. Ive almost got what ive been trying to do for weeks.
i have a photo gallery from on of the “Kirupa” tutorials using xml, but this ones with a 5X4 grid.

I want only the grid to up on stage and when you click the thumbnail i want the larger image to show up over the grid!!and then a “back button” thats returns to the grid of images and so on.

I have everything in place i just need some help getting the depths right and a back btn back to grid of thumbs.

Ive been on this for weeks please help out.

This is my code so far.

cheers :worried: ck

thumbarray = [];
columns = 5;
spacex =92
spacey=60

function loadXML(loaded) {
if (loaded) {
xmlNode = this.firstChild;
image = [];
thumbnails = [];
total = xmlNode.childNodes.length;
for (i=0; i<total; i++) {
image* = xmlNode.childNodes*.childNodes[0].firstChild.nodeValue;
thumbnails* = xmlNode.childNodes*.childNodes[1].firstChild.nodeValue;
}
sload()

} else {
    content = "file not loaded!";
}

}
function drawSquare(thumb, depth, x, y, w, h) {
var mc = thumb.createEmptyMovieClip(“thumb”+depth, depth);
//mc._x = x;
//mc._y = y;
//mc.lineStyle();
//mc.beginFill(colour)
//mc.lineTo(w, 0);
//mc.lineTo(w, h);
//mc.lineTo(0, h);
//mc.endFill();
return mc;
}

xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load(“image.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.loadMovie(image[p], 1);

}}}

function prevImage() {
if (p>0) {
p–;
//picture._alpha = 0;
picture.loadMovie(image[p], 1);

}}

/////////////////////////////////////////////

function firstImage(){
if (loaded ==filesize){
picture._alpha =100;
picture.loadMovie(image[0],1);
}
}

function startload() {
thumbarray[ij].loadMovie(thumbnails[ij]);
checkload();
}

var ij=0
function sload() {
for (var i = 0; i<image.length; i++) {
var thumb = drawSquare(this, i, 0, 0, 0, 104, 71);
thumb._x =48+ (i%columns)*spacex;
thumb._y =82+ Math.floor(i/columns)*spacey;
var clap =thumb.createEmptyMovieClip(“tt”,1)
//clap._x = 2
//clap._y = 2
thumbarray.push(clap);
thumb.pictureValue =i;
thumb.onRelease = function() {
p = this.pictureValue-1;
nextImage();
}
thumb.onRollOver = function() {
this._alpha = 50;

    }
    thumb.onRollOut = function() {
        this._alpha = 100;
    }
}
startload()

}

this.createEmptyMovieClip(“checker”,1000)
function checkload() {
checker.onEnterFrame = function() {

    if (thumbarray[ij]._width) {
        
        delete this.onEnterFrame;
        if (ij&lt;thumbarray.length-1) {
            ij++;
            startload();
        }
    }
}

}
function startload() {
thumbarray[ij].loadMovie(thumbnails[ij]);
checkload();
}