var fadeInStartOpac=0;
var fadeOutStartOpac=0;
var tid=0;
var idFadeOut="";
var idFadeIn="";

var fadeInTimer;
var fadeOutTimer;

function fadeIn_timer() {
   if (idFadeIn != "") {
      changeOpac(fadeInStartOpac, idFadeIn);
      fadeInStartOpac++;
      if (fadeInStartOpac <= 100)
         fadeInTimer = setTimeout("fadeIn_timer()", tid);
   }
}

function fadeOut_timer() {
   if (idFadeOut != "") {
      changeOpac(fadeOutStartOpac, idFadeOut);
      fadeOutStartOpac--;
      if (fadeOutStartOpac >= 0)
         fadeOutTimer = setTimeout("fadeOut_timer()", tid);
   }
}


function fade(id1, id2, opacStart, millisec, nytBillede) {
	var speed = Math.round(millisec / 100);
	
   idFadeOut = id1;
   idFadeIn = id2;
   tid = speed;
	
   clearTimeout(fadeInTimer);
   clearTimeout(fadeOutTimer);
   swap(id1, id2);

   document.getElementById(id2).src = nytBillede;
   
   fadeInStartOpac = opacStart;
	fadeInTimer = setTimeout("fadeIn_timer()",0);
	
	if(document.getElementById(id1).style.opacity > 0) {
		fadeOutStartOpac = document.getElementById(id1).style.opacity * 100;
		fadeOutTimer = setTimeout("fadeOut_timer()", 0);
	}
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
	var object = document.getElementById(id).style; 
	object.opacity = (opacity / 100);
	object.MozOpacity = (opacity / 100);
	object.KhtmlOpacity = (opacity / 100);
	object.filter = "alpha(opacity=" + opacity + ")";
}

function swap(id1, id2) {
	var tmpsrc = "";
   var opac1  = 100;
   var opac2  = 100;
   if(document.getElementById(id1).style.opacity < 100) {
		opac1 = document.getElementById(id1).style.opacity * 100;
	}
	if(document.getElementById(id2).style.opacity < 100) {
		opac2 = document.getElementById(id2).style.opacity * 100;
	}

	tmpsrc = document.getElementById(id1).src;
	document.getElementById(id1).src = document.getElementById(id2).src;
	document.getElementById(id2).src = tmpsrc;
	
	changeOpac(opac2, id1);
	changeOpac(opac1, id2);
}