Ok well I am using the motion tween lib from here:
Motion Tween Libs
and utilizing its opacity tween function along with its color tween function to preform a very slick fadein when a visitor comes to my site.
unfortunately by using "IETester" it clearly wont work with IE5 but IE6 and up works perfect.
I even pointed IE5 to the
Motion Tween Libs site and tried to run the demos but same result its just too modern for IE5.
I don't want to loose the effect, but am willing to drop the effect for IE5 alone.
here is my script:
Code:
function startLoading()
{
var docBody = document.getElementsByTagName('body')[0];
docBody.style.background="url(images/loading.gif)";
docBody.style.backgroundColor="#797979";
docBody.style.backgroundPosition="center";
docBody.style.backgroundRepeat="no-repeat";
setTimeout('opacityLoad()',4000);
}
function opacityLoad()
{
document.getElementsByTagName('body')[0].style.background="";
bodyColorTween = new ColorTween(document.getElementsByTagName('body')[0].style, 'backgroundColor', Tween.regularEastIn, '797979', 'FFFFFF', 1);
bodyColorTween.start()
headerFadeIn = new OpacityTween(document.getElementById('header'),Tween.regularEaseIn, 0, 100, 1);
setTimeout('headerFadeIn.start()',200);
logoFadeIn = new OpacityTween(document.getElementById('logo'),Tween.regularEaseIn, 0, 100, 1);
setTimeout('logoFadeIn.start()',200);
navigationFadeIn = new OpacityTween(document.getElementById('navigation'),Tween.regularEaseIn, 0, 100, 1);
setTimeout('navigationFadeIn.start()',600);
mainFadeIn = new OpacityTween(document.getElementById('main'),Tween.regularEaseIn, 0, 100, 1);
setTimeout('mainFadeIn.start()',800);
contentFadeIn = new OpacityTween(document.getElementById('content'),Tween.regularEaseIn, 0, 100, 1);
setTimeout('contentFadeIn.start()',1000);
bgDecoFadeIn = new OpacityTween(document.getElementById('bg_deco'),Tween.regularEaseIn, 0, 100, 2);
setTimeout('bgDecoFadeIn.start()',1500);
//SLIDE NAVIGATION ARROW IN FROM THE RIGHT
navArrowStart = new Tween(document.getElementById('nav_arrow').style,'left',Tween.elasticEaseOut,700,40,4,'px');
setTimeout('navArrowStart.start()',1000);
//FADE IN NAVIGATION ARROW
navArrowFadeIn = new OpacityTween(document.getElementById('nav_arrow'),Tween.regularEaseIn, 0, 100, 1);
setTimeout('navArrowFadeIn.start()',1200);
}