// JavaScript Document
function start(){
	stelEvents()
	veranderPag("home_")
}

//script voor veranderen plaatjes en highlight
function veranderPag(id){
	var tds = document.getElementById("menu").getElementsByTagName("td")
	for(i=0;i<tds.length;i++){
		if(tds[i].id != id){
			tds[i].style.backgroundColor = "#FFFFFF"
		}
	}
	document.getElementById(id).style.backgroundColor = "#FFF200"
	var pl = "url(img/claris_" + id + "image.jpg)"
	document.getElementById("top_balk_r").style.backgroundImage = pl
}

// Events voor drop-down en pagina lay-out
var tOut

function stelEvents(){
	var ankers = document.getElementById("menu").getElementsByTagName("a")
	for(i=0;i<ankers.length;i++){
		ankers[i].onclick = function(){
			veranderPag(this.parentNode.id);
		}
		if(i>0){
			var ddId = ankers[i].parentNode.id;
			linkNaar = document.getElementById(ddId + "dd").getElementsByTagName("a")[0].href;
			ankers[i].href = linkNaar
			ankers[i].onmouseover = function(){
				verbergAlles()
				toonMenu(this.parentNode.id + "dd", this.parentNode.offsetLeft)
			}
			ankers[i].onmouseout = function(){
				verbergMenu(this.parentNode.id + "dd")
			}
		}
	}
	var dd_ankers = document.getElementById("menu_container").getElementsByTagName("a")
	for(i=0;i<dd_ankers.length;i++){
		dd_ankers[i].onclick = function(){
			veranderPag(this.parentNode.parentNode.id.substr(0, this.parentNode.parentNode.id.length-2));
		}
		dd_ankers[i].onmouseover = function(){
			this.parentNode.style.backgroundColor = "#cde4fb"
		}
		dd_ankers[i].onmouseout = function(){
			this.parentNode.style.backgroundColor = ""
		}
	}
}

function verbergAlles(){
	var ddMAr = document.getElementById("menu_container").getElementsByTagName("div");
	for(i=0;i<ddMAr.length;i++){
		if(ddMAr[i].className == "dd"){ddMAr[i].style.display = "none"}
	}
	if(tOut){clearTimeout(tOut)}
}

function toonMenu(id, links){
	ddM = document.getElementById(id)
	ddM.style.display = "block"
	ddM.style.left = document.getElementById("pagina").offsetLeft + links + "px"
	ddM.onmouseover = function(){clearTimeout(tOut)}
	ddM.onmouseout = function(){verbergMenu(id)}
}

function verbergMenu(id){
	ddM = document.getElementById(id)
	tOut = setTimeout("ddM.style.display = 'none'", 300)
}


