# Individual preloader for thumbs in gallery

**URL:** <https://forum.kirupa.com/t/individual-preloader-for-thumbs-in-gallery/246854>\
**Category:** flash\
**Created:** [December 15, 2007, 12:39pm UTC](https://forum.kirupa.com/t/individual-preloader-for-thumbs-in-gallery/246854 "2007-12-15T12:39:32Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![tane](https://avatars.discourse-cdn.com/v4/letter/t/e274bd/32.png) [@tane](https://forum.kirupa.com/u/tane)\
**Post date:** [December 15, 2007, 12:39pm UTC](https://forum.kirupa.com/t/individual-preloader-for-thumbs-in-gallery/246854/1 "2007-12-15T12:39:32Z")

</div>

Hi,  
I’m new to actionscript 3 (and haven’t used 1 or 2). I’m am building a dynamic image gallery with thumbs that loads all data from and external xml file. I want each thumbs to have its own prelaoder but at present, it only works for the last thumb loaded. I don’t know how to reference each individual thumbloader. Here’s the code relating to my issue:

//Count and load each thumb.  
var thumbCount:int = galleryList[galCount].thumb;  
for each (var thumbTitle in galleryList[galCount].thumb) {  
trace(thumbTitle);  
var thumbLoader:Loader = new Loader();  
thumbLoader.load(new URLRequest(thumbTitle));

```
    var thumbContainer:MovieClip = new MovieClip();
    thumbContainer.name = "thumbContainer" + thumbCount;
    thumbContainer.buttonMode = true;
    //thumbContainer.addChild(thumbLoader);
    
    thumbLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, thumbProgress); 
    
    // Create the label for the thumb Loaderinfo display.
    var loadInfo:TextField = new TextField();
    loadInfo.autoSize = TextFieldAutoSize.CENTER;
    loadInfo.selectable = false;
    loadInfo.defaultTextFormat = loadFormat;
    loadInfo.text = 0 + "%";

    function thumbProgress(evt:ProgressEvent):void {
        var percent:Number = Math.floor(evt.bytesLoaded / evt.bytesTotal * 100);
        loadInfo.text = percent + "%";
    }

    //Get the name/url of the images being linked to thumbnails.
    var imageName = galleryList[galCount].image[thumbCount];
    thumbContainer.imageURL = imageName;
    
    //Set the position of each thumbnail.
    thumbContainer.y = thumbyPos;
    thumbyPos = thumbyPos + 110;
    
    //Add the event that opens/removes the image when the thumbnail is clicked.
    thumbContainer.addEventListener(MouseEvent.CLICK, openImage);
    var theImage:MovieClip = new MovieClip()        
    function openImage(event:Object):void {
        if(theImage.numChildren != 0) {
            theImage.removeChildAt(0);
        }                    
        var imageLoader:Loader = new Loader();
        imageLoader.load(new URLRequest(event.currentTarget.imageURL));
        theImage.addChild(imageLoader);
        imageContainer.addChild(theImage);
        theImage.x=0
        theImage.y=0
    }
    // Add items to Stage
    galleryContainer.addChild(label);
    galleryContainer.addChild(thumbStripContainer);
    thumbStripContainer.addChild(thumbContainer);        
    thumbContainer.addChild(loadInfo);
    galleryContainer.addChild(moveUp);
    galleryContainer.addChild(moveDown);
    galleryContainer.addChild(thumbStripMask);
    addChild(imageContainer);

    
    // Apply the mask to the thumbstrip to show correct area.
    thumbStripContainer.mask = thumbStripMask;
    
    //Increase the thumb count.
    thumbCount++;
}  

```

I can attach the whole thing if need be. All help is greatly appreciated!!

Cheers,  
Tane