// Change these
var interval = 50;
var leaveonscreen = 2000;

// Leave this
var img1;
var img2;
var i = 0;
function startfade(id, duration) {
	img1 = document.getElementById(id);
	img1.style.position = "relative";
	img1.style.zIndex = "2";
	img2 = document.createElement("img");
	img2.style.position = "absolute";
	img2.style.top = "0px";
	img2.style.left = "0px";
	img2.loaded = false;
	img2.style.zIndex = "1";
	img2.onload = function() {
		this.loaded = true;
	}
	i++;
	if (i == banners.length) i = 0;
	img1.parentNode.insertBefore(img2, img1);
	for (j = 0; j < banners.length; j++) {
		new Image().src = banners[j];
	}
	setTimeout(function() { img2.src = "get_site_banner.php?img="+banners[i]; }, 1000);
	dofade(100);
}
function dofade(opacity) {
	if (img2.loaded === false && opacity < 100) {
		setTimeout(function() {dofade(opacity)}, interval);
		return;
	}
	if (opacity >= 0) {
		if (document.body.filters) {
			img1.style.filter = "alpha(opacity="+opacity+")";
		} else {
			img1.style.opacity = opacity / 100;
		}
		if (opacity < 100) {
			opacity -= 5;
			setTimeout(function() {dofade(opacity)}, interval);
		} else {
			setTimeout(function() {dofade(95)}, leaveonscreen);
		}
	} else {
		img1.src = img2.src;
		i++;
		if (i == banners.length) i = 0;
		setTimeout(function() {
			img2.src = "get_site_banner.php?img="+banners[i];
			img2.loaded = false;
		}, 600);
		setTimeout(function () { dofade(100); }, 500);
	}
}