Jump to content

Help with IE9 Opacity!


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 post
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 post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...