I have two connected scripts running on my page – one to roll out an image (using clip), the other to cause certain text to fade in (using color and visibility). The scripts work fine in Firefox, but the text does not fade in when viewed in IE. I’ve narrowed the problem code to the following.
I have an element on my page with the id “fadetext” and visibility set to hidden, and on my page load I call the function imageRoll(), which in turn calls textFadeIn():
[CODE]function imageRoll() {
textFadeIn();
}
function textFadeIn() {
document.getElementById(“fadetext”).style.visibility=’visible’;
alert(document.getElementById(“fadetext”).style.visibility);
}
This works fine. When I add in the other components that make imageRoll() work, that’s when there are problems in IE. The alert still comes up, showing that textFadeIn() is still being called correctly, but the visibility of “fadetext” is still hidden. This only happens in IE:
[CODE]var left=200;
var right=200;
function imageRoll() {
document.getElementById(“disappear”).style.visibility=’hidden’;
var image=document.getElementById(“image”);
if (left > 0) {
left=left-1;
right=right+1;
image.style.clip=’rect(0 ‘ + right + ‘px 404px ‘ + left + ‘px)’;
window.setTimeout(imageRoll,1);
} else {
textFadeIn();
}
}
function textFadeIn() {
document.getElementById(“fadetext”).style.visibility=’visible’;
alert(document.getElementById(“fadetext”).style.visibility);
}
All code is in <head>