Original Post
I am trying to write a script that will allow me to load various images on a page and then fade them in and out at the same time (each on a different phase). The problem I am having is I am using an array of AnimatedImages (a data type I created). The array gets created correctly but after the first call to the fade function the values become undefined. I'm very new to javascript so go easy on me :) The relevant html is is simply 3 image tags. Two of them call onload="javascript:AddAnimatedImage('BlueIris', 1, 1, 0)" onload="javascript:AddAnimatedImage('IcySea', 1, 1, 0)" The third is just a temporary dummy I am using to call onload="javascript:DoFade()" The images get displayed correctly the first time. The set interval function is working but on the second iteration of that function, it seems like my animatedImages array is being cleared though it does still have a length of 2... Thanks for any help, Webby
var animatedImages = Array();
function AnimatedImage()
{
var myImageID;
var myValue;
var myPlus;
var myMinus;
this.CreateNew = CreateNew;
this.SetImageID = SetImageID;
this.SetValue = SetValue;
this.SetPlus = SetPlus;
this.SetMinus = SetMinus;
this.GetImageID = GetImageID;
this.GetValue = GetValue;
this.GetPlus = GetPlus;
this.GetMinus = GetMinus;
function CreateNew(ImageID, Value, Plus, Minus)
{
SetImageID(ImageID);
SetValue(Value);
SetPlus(Plus);
SetMinus(Minus);
}
function SetImageID(ImageID)
{
myImageID = ImageID;
}
function SetValue(Value)
{
myValue = Value;
}
function SetPlus(Plus)
{
myPlus = Plus;
}
function SetMinus(Minus)
{
myMinus = Minus;
}
function GetImageID()
{
return myImageID;
}
function GetValue()
{
return myValue;
}
function GetPlus()
{
return myPlus;
}
function GetMinus()
{
return myMinus;
}
}
function AddAnimatedImage(newID, value, plus, minus){
animated = new AnimatedImage();
animated.CreateNew(newID, value, plus, minus);
animatedImages.push(animated);
}
function IE(animated){
if (animated.GetValue<[80]]&&animated.GetPlus){
animated.SetValue(animated.GetValue + [1]);
}
else{
animated.SetPlus([0]);
animated.SetMinus([[[1]]]);
}
if (animated.GetValue>[30]&&animated.GetMinus){
animated.SetValue(animated.GetValue - [1]);
}
else{
animated.SetPlus([1]);
animated.SetMinus([0]);
}
document.getElementById(animated.GetImageID).filters[[0]].opacity=value
}
function MOZ(animated){
if (animated.GetValue<[80]&&animated.GetPlus){
animated.SetValue(animated.GetValue + [1]);
}
else{
animated.SetPlus([0]);
animated.SetMinus([1]);
}
if (animated.GetValue>[30]&&animated.GetMinus){
animated.SetValue(animated.GetValue - [1]);
}
else{
animated.SetPlus([1]);
animated.SetMinus([0]);
}
document.getElementById(animated.GetImageID).style.MozOpacity=value+"%"
}
function DoFade(){
var all = animatedImages.length;
for(i=[0]; i<all; i++)
{
if (window.sidebar){
setInterval(MOZ, [100], animatedImages);
}
if (document.all){
setInterval(IE, [100], animatedImages);
}
}
}