Ok, so this is a version of this gallery. My issue is, I have added 3 staggered backgrounds behind each picture that act as a tri-color border around the image, named borderOuter, borderMiddle, borderInner. When i click on the thumbnail, i would like the border to disappear. i have added
borderOuter._alpha = 0;
borderMiddle._alpha = 0;
borderInner._alpha = 0;
borderOuter._visible = false;
borderMiddle._visible = false;
borderInner._visible = false;
to everthing i can think of, and yet, the borders still show up for just a second before the preloader starts for each image. IE, I go to the page, the borders show as if they are bordering a 0 px movie clip, preloader starts, they disappear, and then they fade in correctly as the image fades in. I click a thumbnail and the borders show as if they are bordering a 0 px movie clip, preloader starts, they disappear, and then they fade in correctly as the image fades in.
Here is the full code:
////////////////////////////////////////////////////////////////////////////////////
function loadXML(loaded) {
if (loaded) {
xmlNode = this.firstChild;
image = [];
description = [];
thumbnails = [];
_global.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;
thumbnailer(i);
}
firstImage();
} else {
trace("file not loaded!");
}
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("images2.xml");
/////////Load First Image Function///////////////////////////////////////////////
function firstImage() {
if (loaded == filesize) {
picture._alpha = 0;
picture.loadMovie(image[0],1);
desc_txt.text = description[0];
borderOuter._alpha = 0;
borderMiddle._alpha = 0;
borderInner._alpha = 0;
borderOuter._visible = false;
borderMiddle._visible = false;
borderInner._visible = false;
}
}
/////////Image Preloader Function//////////////////////////////////////////////////////
xCord = 306;
yCord = 202;
p = 0;
this.onEnterFrame = function() {
filesize = picture.getBytesTotal();
loaded = picture.getBytesLoaded();
preloader._visible = true;
preloader._x = xCord-60;
preloader._y = yCord;
picture._x = xCord-(picture._width/2);
picture._y = yCord-(picture._height/2);
borderOuter._width = picture._width+20;
borderOuter._height = picture._height+20;
borderMiddle._width = picture._width+10;
borderMiddle._height = picture._height+10;
borderInner._width = picture._width+4;
borderInner._height = picture._height+4;
borderOuter._x = xCord;
borderOuter._y = yCord;
borderMiddle._x = xCord;
borderMiddle._y = yCord;
borderInner._x = xCord;
borderInner._y = yCord;
if (loaded != filesize) {
preloader.preload_bar._xscale = 100*loaded/filesize;
borderOuter._alpha = 0;
borderMiddle._alpha = 0;
borderInner._alpha = 0;
borderOuter._visible = false;
borderMiddle._visible = false;
borderInner._visible = false;
} else {
preloader._visible = false;
borderOuter._visible = true;
borderMiddle._visible = true;
borderInner._visible = true;
if (picture._alpha<100) {
picture._alpha += 10;
borderOuter._alpha += 10;
borderMiddle._alpha += 10;
borderInner._alpha += 10;
}
}
};
//////////Load clicked thumbnail Image Function////////////////////////////////////////////////
function callImage() {
borderOuter._alpha = 0;
borderMiddle._alpha = 0;
borderInner._alpha = 0;
borderOuter._visible = false;
borderMiddle._visible = false;
borderInner._visible = false;
if (loaded == filesize) {
picture._alpha = 0;
picture.loadMovie(image[p],1);
desc_txt.text = description[p];
borderOuter._alpha = 0;
borderMiddle._alpha = 0;
borderInner._alpha = 0;
borderOuter._visible = false;
borderMiddle._visible = false;
borderInner._visible = false;
}
}
//////////Thumbnail maker///////////////////////////////
function thumbnailer(k) {
loaded_counter = 0;
total_thumbs = _global.total;
var container = thumbnail_mc.createEmptyMovieClip("th"+k, thumbnail_mc.getNextHighestDepth());
container._visible = false;
container._alpha = 0;
var image = container.createEmptyMovieClip("img", container.getNextHighestDepth());
tlistener = new Object();
tlistener.onLoadInit = function(target_mc) {
target_mc.pictureValue = k;
target_mc.onRelease = function() {
p = this.pictureValue;
callImage();
borderOuter._alpha = 0;
borderMiddle._alpha = 0;
borderInner._alpha = 0;
};
target_mc.onRollOver = function() {
this._alpha = 50;
};
target_mc.onRollOut = function() {
this._alpha = 100;
};
loaded_counter++;
counting_txt = loaded_counter;
if (loaded_counter == total_thumbs) {
grid_maker_01();
}
};
image_mcl = new MovieClipLoader();
image_mcl.addListener(tlistener);
image_mcl.loadClip(thumbnails[k],"thumbnail_mc.th"+k+".img");
}
///////////Layout Functions/////////////////////////////////////////////////////////////////////
MovieClip.prototype.grid_maker_01 = function(f) {
num = 0;
col = 4;
row = 2;
space = 10;
for (l=0; l<row; l++) {
for (j=0; j<col; j++) {
if (num<_global.total) {
with (eval("this.thumbnail_mc.th"+num)) {
_x = (_width+space)*j;
_y = (_height+space)*l;
_visible = true;
}
num++;
}
}
}
this.cascader();
};
//////////////////////////////////////////////////////////////////////////////////
MovieClip.prototype.cascader = function() {
inter = 300;
c = 0;
delayed_fade = function () {
if (c<_global.total) {
with (eval("this.thumbnail_mc.th"+c)) {
fadein();
}
c++;
} else {
main_menu.boton_reset._visible = true;
clearInterval(delay);
}
};
delay = setInterval(delayed_fade, inter);
};
///////////////////////////////////////////////////////////////////////////////
MovieClip.prototype.fadein = function() {
this.onEnterFrame = function() {
if (this._alpha<100) {
this._alpha = this._alpha+5;
} else {
this._alpha = 100;
delete this.onEnterFrame;
}
};
};
///////////////////////////////////////////////////////////////////////////////////////
MovieClip.prototype.positioner = function(xDest, yDest, rDest, aDest) {
this.onEnterFrame = function() {
this._x = xDest-(xDest-this._x)/1.2;
this._y = yDest-(yDest-this._y)/1.2;
this._alpha = aDest-(aDest-this._alpha)/1.2;
this._rotation = rDest-(rDest-this._rotation)/1.2;
if ((Math.abs(xDest-this._x)<=1) and (Math.abs(yDest-this._y)<=1)) {
delete this.onEnterFrame;
this._x = xDest;
this._y = yDest;
this._alpha = aDest;
this._rotation = rDest;
}
};
};
/////////////////////////////////////////////////////////////////////////
function reset() {
for (d=0; d<_global.total; d++) {
with (eval("this.thumbnail_mc.th"+d)) {
_x = 0;
_y = 0;
_alpha = 0;
_xscale = 100;
_yscale = 100;
_rotation = 0;
visible = false;
}
}
}
Any help would be greatly appreciated.
~nik
