var Images = new Array();
Images[0] = "img/virtualisatie_background.jpg";
Images[1] = "img/nieuw_netwerk.jpg";
Images[2] = "img/green_it.jpg";
Images[3] = "img/fire.jpg";
Images[4] = "img/tom.jpg";

var Text = new Array();
Text[0] = "<div style='margin-left:5px;color:RGB(0,0,0);'><span style='font-size:30pt;'>Virtualiseren?</span><br><br>Denkt u aan virtualisatie? Bij Tracks kunnen we er u alles over vertellen en het voor u inrichten;<br><br>- Bespaar op hardware aanschaf<br>- Bespaar op de energierekening<br>- Goedkopere hoge beschikbaarheid</div>";
Text[1] = "<div style='margin-left:5px;color:RGB(0,0,0);'><span style='font-size:30pt;'>Bedrijfsnetwerk aan vervanging toe?</span><br><br>Windows 2008 of toch Small Business Server? Bij Tracks bent u altijd aan het juiste adres. Geen hoge onverwachte rekeningen, altijd iemand bereikbaar. Open, en eerlijk.</div>";
Text[2] = "<div style='margin-left:5px;color:RGB(0,0,0);'><span style='font-size:30pt;'>Green IT?</span><br><br>Bij Tracks denken we graag aan het milieu. Wij leveren hardware die voldoet aan de energiestandaard van vandaag. En dat merkt u aan uw energierekening.</div>";
Text[3] = "<div style='margin-left:5px;color:RGB(0,0,0);'><span style='font-size:30pt;'>ToB: Tracks Online Backup</span><br><br>Bij Tracks weten we hoe belangrijk het is om uw gegevens goed te backuppen. Met ToM bent u niet alleen verzekerd van een goede backup, maar weet u ook zeker dat uw backup altijd veilig buiten uw kantoorpand is opgeslagen. Zodat u in geval van een brand weer snel online bent op een andere locatie!</div>";
Text[4] = "<div style='margin-left:5px;color:RGB(0,0,0);'><span style='font-size:30pt;'>ToM: Tracks Online Monitoring</span><br><br>Bij Tracks doen wij onze uiterste best om problemen te voorkomen. Als er dan toch problemen optreden, wilt u natuurlijk dat die zo snel mogelijk ontdekt worden. Met de service ToM van Tracks bent u ervan verzekerd dat wij problemen tijdig detecteren en verhelpen!</div>";

$count = 0;

function docReady()
	{

	$('#NavPopupHome').css({ opacity:0.9 });
	$('#NavPopupService').css({ opacity:0.9 });
	$('#NavPopupDiensten').css({ opacity:0.9 });
	$('#NavPopupOverons').css({ opacity:0.9 });

	$('#NavPopupHome').width(125);
	$('#NavPopupService').width(115);
	$('#NavPopupDiensten').width(225);
	$('#NavPopupOverons').width(160);
	
	$('#fadeOpac').css({ opacity:0.5 });

	$('#searchbox').focus(function() {
		$(this).val('');
	});

	$('#searchbox').focusout(function() {
		if($(this).val() == "")
			{
			$(this).val('Typ uw zoekwaarde');
		}
	});


	//home knop---------------------------------------------------------------------------
	$('#BtnHome').mouseover(function() {
		PopupHomeMarginLeft = $('#BtnHome').offset().left;
		$('#NavPopupHome').css({"margin-left": PopupHomeMarginLeft});

		HideAll();

		//$('#NavPopupHome').show();
		//home heeft geen opties!
		//code is er voor als er in de toekomst wel een menu moet komen
		//clearAllTimeouts();
	});

	$('#BtnHome').mouseout(function() {
		HomeTimeout = setTimeout('HideElement("#NavPopupHome")',500);
	});

	$('#NavPopupHome').mouseover(function() {
		clearTimeout(HomeTimeout);
	});
	$('#NavPopupHome').mouseout(function() {
		HomeTimeout = setTimeout('HideElement("#NavPopupHome")',500);
	});

	//einde home knop------------------------------------------------------------------------
	//Service knop---------------------------------------------------------------------------
	
	$('#BtnService').mouseover(function() {
		PopupServiceMarginLeft = $('#BtnService').offset().left;
		$('#NavPopupService').css({"margin-left": PopupServiceMarginLeft});

		HideAll();

		$('#NavPopupService').show();
		clearAllTimeouts();
	});

	$('#BtnService').mouseout(function() {
		ServiceTimeout = setTimeout('HideElement("#NavPopupService")',500);
	});

	$('#NavPopupService').mouseover(function() {
		clearTimeout(ServiceTimeout);
	});
	$('#NavPopupService').mouseout(function() {
		ServiceTimeout = setTimeout('HideElement("#NavPopupService")',500);
	});

	//einde service knop----------------------------------------------------------------------
	//Diensten knop---------------------------------------------------------------------------
	


	$('#BtnDiensten').mouseover(function() {
		PopupDienstenMarginLeft = $('#BtnDiensten').offset().left;
		$('#NavPopupDiensten').css({"margin-left": PopupDienstenMarginLeft});

		HideAll();
		$('#NavPopupDiensten').show();
		clearAllTimeouts();
	});

	$('#BtnDiensten').mouseout(function() {
		DienstenTimeout = setTimeout('HideElement("#NavPopupDiensten")',500);
	});

	$('#NavPopupDiensten').mouseover(function() {
		clearTimeout(DienstenTimeout);
	});
	$('#NavPopupDiensten').mouseout(function() {
		DienstenTimeout = setTimeout('HideElement("#NavPopupDiensten")',500);
	});

	//einde service knop----------------------------------------------------------------------
	//Over ons knop---------------------------------------------------------------------------

	$('#BtnOverons').mouseover(function() {
		PopupOveronsMarginLeft = $('#BtnOverons').offset().left;
		$('#NavPopupOverons').css({"margin-left": PopupOveronsMarginLeft});


		HideAll();
		$('#NavPopupOverons').show();
		clearAllTimeouts();
	});

	$('#BtnOverons').mouseout(function() {
		OveronsTimeout = setTimeout('HideElement("#NavPopupOverons")',500);
	});

	$('#NavPopupOverons').mouseover(function() {
		clearTimeout(OveronsTimeout);
	});
	$('#NavPopupOverons').mouseout(function() {
		OveronsTimeout = setTimeout('HideElement("#NavPopupOverons")',500);
	});

	//einde service knop----------------------------------------------------------------------

	fadeNext();
}

function HideElement(element)
	{
	$(element).hide();
}
function HideAll()
	{
	HideElement("#NavPopupHome");
	HideElement("#NavPopupService");
	HideElement("#NavPopupDiensten");
	HideElement("#NavPopupOverons");
}

function clearAllTimeouts()
	{
	clearTimeout(HomeTimeout);
	clearTimeout(ServiceTimeout);
	clearTimeout(DienstenTimeout);
	clearTimeout(OveronsTimeout);
}

function fadeNext()
	{
	$('#fadeBlock').css("background-image", 'url(' + Images[$count] + ')'); 
	$('#fadeTxt').html(Text[$count]);

	$('#fadeBlock').fadeIn(2000,function() {
	
	});

	$count++;

	if(Images[$count] == null || Text[$count] == null)
		{
		$count = 0;
	}
	setTimeout('fadeOut();',5000);
}

function fadeOut()
	{
	$('#fadeBlock').fadeOut(2000,function() { 
		fadeNext();
	});
}