There are probably a dozen threads on this subject on this forum and for some reason nobody ever comes up with a solution. I propose once and for all we solve it. Considering it all stems from a tutorial on this site you’d think somebody here could do it.
The Problem
Sometimes, but not always, when loading thumbnails they become jumbled or overlap one another. Here are some example photos of what we mean when we say this:
** Working**
** Not Working**
As you can see, in the second scrolling thumbnail bar, they’re overlapping, or jumbled/stacked on top of each other.
Reproducible
This seems occur when switching from one gallery’s thumbnails to another. For example, clicking on Gallery1 and then quickly clicking on Gallery2 before Gallery1 has finished loading will cause this to happen – most of the time. If not, clicking back and forth between the galleries will eventually make it occur. It is reproducible, but not 100% of the time. I believe this has something to do with the position in the loading loop, but I’m not sure.
The Code
Here is the code in question:
var k = 0, total;
function loadThumb() {
var target_mc = thumbnail_mc.createEmptyMovieClip("t"+k,
thumbnail_mc.getNextHighestDepth());
var temp = this.createEmptyMovieClip("tmp"+k, this.getNextHighestDepth());
target_mc.loadMovie(thumbnails[k]);
temp.onEnterFrame = function() {
if (target_mc._width) {
if (k) {
//if it isn't the first thumb, get the y position and heigth of
the previous thumb
target_mc._x = thumbnail_mc["t"+(k-1)]._x+thumbnail_mc["t"+(k-1)]._width+10;
} else {
//set the first thumb to y = 0
target_mc._x = 25;
}
target_mc.pictureValue = k;
target_mc.onRelease = function() {
bgd._visible = true;
picture._visible = true;
desc_text._visible = true;
previous_btn._visible = true;
next_btn._visible = true;
windowScroll._visible = false;
nextBtn._visible = false;
backBtn._visible = false;
p = this.pictureValue-1;
nextImage();
};
target_mc.onRollOver = function() {
this._alpha = 100;
thumbNailScroller();
};
target_mc.onRollOut = function() {
this._alpha = 100;
};
nextThumb();
delete this.onEnterFrame;
}
};
}
function nextThumb() {
k<total-1 ? (k++, loadThumb()) : null;
}
Possible Causes
While loading thumbnails for Gallery1 the loop gets interrupted, and rather than resetting for Gallery2 it continues to loop somehow without resetting the X position.
Possible Solutions
1) Reset the loop back to 0 while saving it with a temp variable before restarting the loop?
2) Passing a variable on click to “break” out of the loop and end the thumbnail loading?
3) Somehow using onLoadInit() or onLoadComplete()?
4) Checking to see if Thumb2’s X value is <= Thumb1’s X value?
I’ll admit, I’m new to ActionScript, but not to programming. This error intrigues me, not just because it has affected me directly, but because it has affected so many other people, and yet the solution has alluded them so far.
If anyone has any possible solutions please post them so this bug can be laid to rest once and for all. Thank you.