var highlights = document.getElementById("highlights");
var hlImgByClass=highlights.getElementsByTagName("img");
var hlTextByClass=highlights.getElementsByTagName("div");
var hlImgNum = hlImgByClass.length;
var hlDel=0;
var hlImgPosition;
//document.getElementById("highlightnav").innerHTML="<div id='highlightcounter'></div><a href='#' id='hlprev'>Vorige</a> | <a href='#' id='hlnext'>Volgende</a>";

hlImgByClass[0].style.top="0px";
hlImgByClass[0].style.position="absolute";

hlTextByClass[0].style.top="0px";
hlTextByClass[0].style.left="450px";
hlTextByClass[0].style.position="absolute";

function hlRemoveRest(){
	for(hlx=1;hlx<hlImgNum; hlx++){
		hlImgByClass[hlx].style.display="none";
		hlTextByClass[hlx].style.display="none";
		hlImgByClass[hlx].style.top="0px";
		hlImgByClass[hlx].style.position="absolute";
		hlTextByClass[hlx].style.top="0px";
		hlTextByClass[hlx].style.left="450px";
		hlTextByClass[hlx].style.position="absolute";
	}
}
	
hlRemoveRest();

function hlChangeNum(hlImgPosition){
document.getElementById("highlightcounter").innerHTML = String(hlImgPosition+1) + "/" + String(hlImgNum);
}

hlChangeNum(0);

function hlGoNext(){	
	if(hlImgNum>hlDel+1){
		$(hlTextByClass[hlDel]).fadeOut("400");
		$(hlTextByClass[String(hlDel+1)]).fadeIn("400");
		$(hlImgByClass[hlDel]).fadeOut("400");
		$(hlImgByClass[String(hlDel+1)]).fadeIn("400");
		hlDel++;
		hlChangeNum(hlDel);
	}else{
		$(hlTextByClass[hlDel]).fadeOut("400");
		$(hlTextByClass[0]).fadeIn("400");
		$(hlImgByClass[hlDel]).fadeOut("400");
		$(hlImgByClass[0]).fadeIn("400");
		hlDel=0;
		hlChangeNum(hlDel);
	}
}

function hlGoPrev(){	
	if(hlDel>0){
		$(hlTextByClass[hlDel]).fadeOut("400");
		$(hlTextByClass[String(hlDel-1)]).fadeIn("400");
		$(hlImgByClass[hlDel]).fadeOut("400");
		$(hlImgByClass[String(hlDel-1)]).fadeIn("400");
		hlDel--;
		hlChangeNum(hlDel);
	}else{
		$(hlTextByClass[hlDel]).fadeOut("400");
		$(hlTextByClass[hlImgNum-1]).fadeIn("400");
		$(hlImgByClass[hlDel]).fadeOut("400");
		$(hlImgByClass[hlImgNum-1]).fadeIn("400");
		hlDel=hlImgNum-1;
		hlChangeNum(hlDel);
	}
}


document.getElementById("hlnext").onclick= function(){
hlGoNext();
}

document.getElementById("hlprev").onclick= function(){
hlGoPrev();
}