function opacity(id, opacStart, opacEnd, millisec) { //speed for each frame var speed = Math.round(millisec / 100); var timer = 0; //determine the direction for the blending, if start and end are the same nothing happens if(opacStart > opacEnd) { for(i = opacStart; i >= opacEnd; i--) { setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed)); timer++; } } else if(opacStart < opacEnd) { for(i = opacStart; i <= opacEnd; i++) { setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed)); timer++; } } } //change the opacity for different browsers function changeOpac(opacity, id) { var object = document.getElementById(id).style; if(typeof object.opacity == "string") { object.opacity = (opacity / 100); object.MozOpacity = (opacity / 100); object.KhtmlOpacity = (opacity / 100); } else { object.filter = "alpha(opacity=" + opacity + ")"; } } function shiftOpacity(id, millisec) { //if an element is invisible, make it visible, else make it ivisible if(document.getElementById(id).style.opacity == 0) { opacity(id, 0, 100, millisec); } else { opacity(id, 100, 0, millisec); } } function blendimage(divid, imageid, imagefile, millisec) { var speed = Math.round(millisec / 100); var timer = 0; //set the current image as background document.getElementById(divid).style.backgroundImage = "url(" + document.getElementById(imageid).src + ")"; //make image transparent changeOpac(0, imageid); //make new image document.getElementById(imageid).src = imagefile; //fade in image for(i = 0; i <= 100; i++) { setTimeout("changeOpac(" + i + ",'" + imageid + "')",(timer * speed)); timer++; } } function currentOpac(id, opacEnd, millisec) { //standard opacity is 100 var currentOpac = 100; //if the element has an opacity set, get it if(document.getElementById(id).style.opacity < 100) { currentOpac = document.getElementById(id).style.opacity * 100; } //call for the function that changes the opacity opacity(id, currentOpac, opacEnd, millisec) } var TimeToFade = 1000.0; function fade(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("animateFade(" + new Date().getTime() + ",'" + eid + "')", 33); } } function animateFade(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; 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("animateFade(" + curTick + ",'" + eid + "')", 33); }