Jump to content

Help with IE9 Opacity!


duncan_cowan
 Share

Recommended Posts

Hi, i have a function that fades elements, however i am trying to get it to work with IE9 but it doesnt seem to recognise when the element has fully faded.This may be a problem with the beta, but i think my function may need changing...Function

var TimeToFade = 1000.0;function introFade(eid){  var element = document.getElementById(eid);  if(element == null)	return;  if(element.FadeState == null)  {	if(element.style.opacity == null		|| element.style.opacity == ''		|| element.style.opacity == '1')	{	  element.FadeState = 2;	}	else	{	  element.FadeState = -2;	}  }  if(element.FadeState == 1 || element.FadeState == -1)  {	element.FadeState = element.FadeState == 1 ? -1 : 1;	element.FadeTimeLeft = TimeToFade - element.FadeTimeLeft;  }  else  {	element.FadeState = element.FadeState == 2 ? -1 : 1;	element.FadeTimeLeft = TimeToFade;	setTimeout("animateIntroFade(" + new Date().getTime() + ",'" + eid + "')", 33);  }}function animateIntroFade(lastTick, eid){  var curTick = new Date().getTime();  var elapsedTicks = curTick - lastTick;  var element = document.getElementById(eid);  if(element.FadeTimeLeft <= elapsedTicks)  {	element.style.opacity = element.FadeState == 1 ? '1' : '0';	element.style.filter = 'alpha(opacity = '		+ (element.FadeState == 1 ? '100' : '0') + ')';	element.FadeState = element.FadeState == 1 ? 2 : -2;	if (element.FadeState == 2 && status == 'fade') {  //if just faded in	  if (curBox<3) {		curBox += 1;		document.getElementById('block'+curBox).style.display = '';		setTimeout("introFade('block"+curBox+"')",500);	  } else if (curBox == 3) {		setTimeout("introFade('block1')",400);		setTimeout("introFade('block2')",400);		setTimeout("introFade('block3')",400);		document.getElementById("block4").style.display = '';		curBox += 1;		setTimeout("introFade('block4')",1400);	  } else if (curBox == 4) {		document.getElementById("block5").style.display = '';		curBox += 1;		setTimeout("introFade('block5')",400);	  } else {		status = 'end';		setTimeout("introFade('intro')",2000);	  }	} else if (element.FadeState == -2 && status == 'fade') { //if just faded out	  element.style.display = 'none';	} else if (status == 'end') { //if finished	  document.getElementById('intro').style.display = "none";	  beginHomeFade();	}	return;  }  element.FadeTimeLeft -= elapsedTicks;  var newOpVal = element.FadeTimeLeft/TimeToFade;  if(element.FadeState == 1)	newOpVal = 1 - newOpVal;  element.style.opacity = newOpVal;  element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';  setTimeout("animateIntroFade(" + curTick + ",'" + eid + "')", 33);}

I have tried myself however this function was not written by me and so i am not sure of some of the opacity parts.The function in use is on this page: www.coscom-pcs.co.uk/test(its in the stripy box)ThanksDuncan

Link to comment
Share on other sites

Hi, sorry my mistake. after some more testing it turns out it is not a problem with the function but one with setting a variable.The variable is first set:

var status = "wait";

Then inside a function it is changed:

function beginAni() {  status = "fade";  document.getElementById("block1").style.display = '';  introFade('block1');}

However, the time it is changed is not working for some reason. Any ideas?Thanks

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...