// Fade Out Images

var maximages = 4; // how many fade images do you have?
var fadespeed = 125; // fade frame time in milliseconds;  125 = 125 ms

///////////// Fade Button 1 //////////////
var fadeintimer1;
var fadeouttimer1;
var fadeincount1 = 0;
var fadeoutcount1 = maximages-1;
var fade1array = new Array(maximages);  // enter all the fade images here
// the first item should be 0, then numbered through 1 less than your maximages

fade1array[0] = "images/Digi-Arc_18_00.jpg";
fade1array[1] = "images/Digi-Arc_18_03.jpg";
fade1array[2] = "images/Digi-Arc_18_05.jpg";
fade1array[3] = "images/Digi-Arc_18_06.jpg";

for (var m = 0; m < maximages; m++) {
eval('pic' + m + ' = new Image();');
eval('pic' + m + '.src = fade1array[m];'); // preloads fade images
}
function fade_in1() {
clearTimeout(fadeouttimer1);
document.images['fade-pic1'].src = fade1array[fadeincount1];
if (fadeincount1 != maximages-1) {
fadeincount1++;
fadeintimer1 = setTimeout('fade_in1()', fadespeed);
}
else {
clearTimeout(fadeintimer1);
fadeincount1 = 0;
   }
}
function fade_out1() {
clearTimeout(fadeintimer1);
document.images['fade-pic1'].src = fade1array[fadeoutcount1];
if (fadeoutcount1 != 0) {
fadeoutcount1--;
fadeouttimer1 = setTimeout('fade_out1()', fadespeed);
}
else {
clearTimeout(fadeouttimer1);
fadeoutcount1 = maximages-1;
   }
}

///////////// Fade Button 2 //////////////
var fadeintimer2;
var fadeouttimer2;
var fadeincount2 = 0;
var fadeoutcount2 = maximages-1;
var fade2array = new Array(maximages);  // enter all the fade images here
// the first item should be 0, then numbered through 1 less than your maximages

fade2array[0] = "images/Digi-Arc_20_00.jpg";
fade2array[1] = "images/Digi-Arc_20_02.jpg";
fade2array[2] = "images/Digi-Arc_20_04.jpg";
fade2array[3] = "images/Digi-Arc_20_06.jpg";

for (var j = 0; j < maximages; j++) {
eval('pic' + j + ' = new Image();');
eval('pic' + j + '.src = fade2array[j];'); // preloads fade images
}
function fade_in2() {
clearTimeout(fadeouttimer2);
document.images['fade-pic2'].src = fade2array[fadeincount2];
if (fadeincount2 != maximages-1) {
fadeincount2++;
fadeintimer2 = setTimeout('fade_in2()', fadespeed);
}
else {
clearTimeout(fadeintimer2);
fadeincount2 = 0;
   }
}
function fade_out2() {
clearTimeout(fadeintimer2);
document.images['fade-pic2'].src = fade2array[fadeoutcount2];
if (fadeoutcount2 != 0) {
fadeoutcount2--;
fadeouttimer2 = setTimeout('fade_out2()', fadespeed);
}
else {
clearTimeout(fadeouttimer2);
fadeoutcount2 = maximages-1;
   }
}

///////////// Fade Button 3 //////////////
var fadeintimer3;
var fadeouttimer3;
var fadeincount3 = 0;
var fadeoutcount3 = maximages-1;
var fade3array = new Array(maximages);  // enter all the fade images here
// the first item should be 0, then numbered through 1 less than your maximages

fade3array[0] = "images/Digi-Arc_24_00.jpg";
fade3array[1] = "images/Digi-Arc_24_02.jpg";
fade3array[2] = "images/Digi-Arc_24_04.jpg";
fade3array[3] = "images/Digi-Arc_24_06.jpg";

for (var k = 0; k < maximages; k++) {
eval('pic' + k + ' = new Image();');
eval('pic' + k + '.src = fade3array[k];'); // preloads fade images
}
function fade_in3() {
clearTimeout(fadeouttimer3);
document.images['fade-pic3'].src = fade3array[fadeincount3];
if (fadeincount3 != maximages-1) {
fadeincount3++;
fadeintimer3 = setTimeout('fade_in3()', fadespeed);
}
else {
clearTimeout(fadeintimer3);
fadeincount3 = 0;
   }
}
function fade_out3() {
clearTimeout(fadeintimer3);
document.images['fade-pic3'].src = fade3array[fadeoutcount3];
if (fadeoutcount3 != 0) {
fadeoutcount3--;
fadeouttimer3 = setTimeout('fade_out3()', fadespeed);
}
else {
clearTimeout(fadeouttimer3);
fadeoutcount3 = maximages-1;
   }
}

///////////// Fade Button 4 //////////////
var fadeintimer4;
var fadeouttimer4;
var fadeincount4 = 0;
var fadeoutcount4 = maximages-1;
var fade4array = new Array(maximages);  // enter all the fade images here
// the first item should be 0, then numbered through 1 less than your maximages

fade4array[0] = "images/Digi-Arc_25_00.jpg";
fade4array[1] = "images/Digi-Arc_25_02.jpg";
fade4array[2] = "images/Digi-Arc_25_04.jpg";
fade4array[3] = "images/Digi-Arc_25_06.jpg";

for (var l = 0; l < maximages; l++) {
eval('pic' + l + ' = new Image();');
eval('pic' + l + '.src = fade4array[l];'); // preloads fade images
}
function fade_in4() {
clearTimeout(fadeouttimer4);
document.images['fade-pic4'].src = fade4array[fadeincount4];
if (fadeincount4 != maximages-1) {
fadeincount4++;
fadeintimer4 = setTimeout('fade_in4()', fadespeed);
}
else {
clearTimeout(fadeintimer4);
fadeincount4 = 0;
   }
}
function fade_out4() {
clearTimeout(fadeintimer4);
document.images['fade-pic4'].src = fade4array[fadeoutcount4];
if (fadeoutcount4 != 0) {
fadeoutcount4--;
fadeouttimer4 = setTimeout('fade_out4()', fadespeed);
}
else {
clearTimeout(fadeouttimer4);
fadeoutcount4 = maximages-1;
   }
}