# Kirupa'a Adding Thumbnails

**URL:** https://forum.kirupa.com/t/kirupaa-adding-thumbnails/265418
**Category:** Uncategorized
**Created:** [July 8, 2008, 6:23pm UTC](https://forum.kirupa.com/t/kirupaa-adding-thumbnails/265418 "2008-07-08T18:23:33Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![ruffneck\_chiken](https://avatars.discourse-cdn.com/v4/letter/r/bc79bd/32.png) [@ruffneck\_chiken](https://forum.kirupa.com/u/ruffneck_chiken)
#### Post date: [July 8, 2008, 6:23pm UTC](https://forum.kirupa.com/t/kirupaa-adding-thumbnails/265418/1 "2008-07-08T18:23:33Z")

</div>

Hi, this is the last issue i am having with this. haha well with help from a couple people on this site i have been able to customize this tutorial to meet my needs but i have one remailing issue. The thumbnails are loading in reverse order from they way they are listed in the XML file or random order. Is there a way to force them to load in the order they are listed in the XML file? Below is the code and thanks in advance for your help.

```auto

function loadXML(loaded) {
if (loaded) {
xmlNode = this.firstChild;
image = [];
description = [];
thumbnails = [];
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;
thumbnails_fn(i);
}
firstImage();
} else {
content = "file not loaded!";
}
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("images.xml");
/////////////////////////////////////
this.createEmptyMovieClip("container", "100"); 
my_mc = new MovieClipLoader(); 
preload = new Object(); 
///////////////////////////////////// 
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 = container.getBytesTotal();
loaded = container.getBytesLoaded();
preloader._visible = true;
if (loaded != filesize) {
preloader.preload_bar._xscale = 100*loaded/filesize;
} else {
preloader._visible = false;
if (container._width== 640) {
container._x = 90;
container._y = 100;
pic_bg._x = 80;
pic_bg._y = 90;
pic_bg._width = 660;
pic_bg._height = 500;
} else {
container._x = 170;
container._y = 20;
pic_bg._x = 160;
pic_bg._y = 10;
pic_bg._width = 500;
pic_bg._height = 660;
}
if (container._alpha<100) {
container._alpha += 10;
pic_bg._alpha += 10;
}
}
};
function nextImage() {
if (p<(total-1)) {
p++;
if (loaded == filesize) {
container._alpha = 0;
pic_bg._alpha = 0;
my_mc.loadClip(image[p], "container");
desc_txt.text = description[p];
picture_num();
}
}
}
function prevImage() {
if (p>0) {
p--;
container._alpha = 0;
pic_bg._alpha = 0;
my_mc.loadClip(image[p], "container");
if (container._width== 640) {
container._x = 90;
container._y = 100;
} else {
container._x = 170;
container._y = 20;
}
desc_txt.text = description[p];
picture_num();
}
}
function firstImage() {
if (loaded == filesize) {
container._alpha = 0;
pic_bg._alpha = 0;
my_mc.loadClip(image[p], "container");
if (container._width == 640) {
container._x = 90;
container._y = 100;
} else {
container._x = 170;
container._y = 20;
}
desc_txt.text = description[p];
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 ((_root._ymouse>=thumbnail_mc._y) && (_root._ymouse<=thumbnail_mc._y+thumbnail_mc._heig ht)) {
if ((_root._xmouse>=(hit_right._x-200)) && (thumbnail_mc.hitTest(hit_right))) {
thumbnail_mc._x -= scroll_speed;
} else if ((_root._xmouse<=(hit_left._x+200)) && (thumbnail_mc.hitTest(hit_left))) {
thumbnail_mc._x += scroll_speed;
}
} else {
delete tscroller.onEnterFrame;
}
};
}
var w = 0;
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+w+5;
w += target_mc._width+5;
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);
}

```

---

<div class="post-metadata">

### Author: ![stringy](https://avatars.discourse-cdn.com/v4/letter/s/919ad9/32.png) [@stringy](https://forum.kirupa.com/u/stringy)
#### Post date: [July 8, 2008, 10:14pm UTC](https://forum.kirupa.com/t/kirupaa-adding-thumbnails/265418/2 "2008-07-08T22:14:44Z")

</div>

see if this helps

> **[Photo gallery like this one - Page 3](https://www.kirupa.com/forum/showthread.php?56005-Photo-gallery-like-this-one&s=dd061abc84a2c75887c8337f87a07437&p=2095978#post2095978)**
>
> Got a web design/development question or just want to hang out with the most awesome people on the planet? Drop on in!

  
it was for a continual scrolling thingy but if you ignore the thumbNailScroller function , it may be close.

---

<div class="post-metadata">

### Author: ![ruffneck\_chiken](https://avatars.discourse-cdn.com/v4/letter/r/bc79bd/32.png) [@ruffneck\_chiken](https://forum.kirupa.com/u/ruffneck_chiken)
#### Post date: [July 8, 2008, 11:40pm UTC](https://forum.kirupa.com/t/kirupaa-adding-thumbnails/265418/3 "2008-07-08T23:40:36Z")

</div>

thanks i am checking it out now…the code i would be testing out would be in the function thumbnails\_fn(k) { correct or is there more i need to intergrate?

---

<div class="post-metadata">

### Author: ![ruffneck\_chiken](https://avatars.discourse-cdn.com/v4/letter/r/bc79bd/32.png) [@ruffneck\_chiken](https://forum.kirupa.com/u/ruffneck_chiken)
#### Post date: [July 9, 2008, 12:00am UTC](https://forum.kirupa.com/t/kirupaa-adding-thumbnails/265418/4 "2008-07-09T00:00:12Z")

</div>

ok i see there is more to it then just that section…i have tried a few things and now just the first thumb loads and none of the rest…■■■■ u are such a big help but i seem stuck again…would it help to see my code again and see how i have altered it to incorperate the new code u suggested?