$(function(){

	if(banners.length == 0) {
		return;
	}

	var OldImg = $("#mid_main img:first").attr('src');
	
	$("#mid_main img:first").remove();

	$("#mid_main").prepend("<div class='f-border'><div class='f-image1'></div><div class='f-image2'></div></div>");
	
	$("div.f-border").css({"background-image":"url(/images/banners/"+banners[0]+")"});

	$("div.f-image1").hide();
	$("div.f-image2").hide();
	
	var preloads = new Array();
	
	for(var i=0;i<banners.length;i++){
		preloads[i] = new Image();
		preloads[i].src = "/images/banners/"+banners[i];
	}
	
	var i = 0;
	var j = 0;
	
	setTimeout(function(){
		$("div.f-border").css({"background-image":"none"});	
		
		i++;
		j++;
		
		$("div.f-image1").css({"background-image":"url(/images/banners/"+banners[i]+")"});
		//$("div.f-image2").css({"background-image":"url(/images/banners/"+banners[2]+")"});
		
		$("div.f-image1").fadeIn(1000);
		$("div.f-image2").fadeIn(1000);

		setInterval(function(){

			var x = j / 2;

			if(parseInt(x) == x) {
				//even
				el1 = "div.f-image1";
				el2 = "div.f-image2";
			} else {
				//odd
				el2 = "div.f-image1";
				el1 = "div.f-image2";
			}

			//show second
			//fade out first

			k = i + 1;

			if(k == banners.length) {
				k = 0;
			}

			$(el2).css({"background-image":"url(/images/banners/"+banners[k]+")"});
			$(el1).css({"background-image":"url(/images/banners/"+banners[i]+")"});

			$(el2).fadeIn(1000);
			$(el1).fadeOut(1000);

			i++;
			j++;

			if(i == banners.length) {
				i = 0;
			}

		},4000);
		
	},4000);
});