var intervalID = false;
var showedThumbnail = false;
var disappear = false;
var appear;
var opaDis = 1;
var opaApp = 0;


function changeSingleImage(event, caller, appearImage) {
	//alert(showedThumbnail);
	if (!disappear) {
		disappear = document.getElementById('image1');
	}
	if (!showedThumbnail) {
		showedThumbnail = document.getElementById('thumbnail1');
	}
	
  if (!intervalID && showedThumbnail != caller) {
	  appear = document.getElementById(appearImage);
	  caller.style.opacity = 1;
	  caller.style.filter = 'alpha(opacity=100, style=0)';
	  caller.style.border = '1px solid #b00';
	  showedThumbnail.style.opacity = '0.5'; 
	  showedThumbnail.style.border = '0';
	  showedThumbnail.style.filter = 'alpha(opacity=50, style=0)';
	  if (!intervalID) {
		intervalID = setInterval('appearItem()', 10);
	  }
	  showedImage = appear;
	  showedThumbnail = caller;
  }
}

function appearItem() {
	opaDis = opaDis - 0.05;
	opaApp = opaApp + 0.05;
	if (navigator.userAgent.indexOf('IE') != -1) {
		disappear.style.filter = 'alpha(opacity='+ opaDis*100 +', style=0)';
		appear.style.filter = 'alpha(opacity='+ opaApp*100 +', style=0)';
	} else {
		disappear.style.opacity = opaDis;
		appear.style.opacity = opaApp;
	}
	if (opaDis < 0) {
		disappear.style.opacity = 0;
		appear.style.opacity = 1;
		if (navigator.userAgent.indexOf('IE') != -1) {
			disappear.style.filter = 'alpha(opacity=0, style=0)';
			appear.style.filter = 'alpha(opacity=100, style=0)';
		} else {
			disappear.style.opacity = 0;
			appear.style.opacity = 1;
		}
		opaDis = 1;
		opaApp = 0;

		clearInterval(intervalID);
		intervalID = false;
		disappear = appear;
	}
}