$(document).ready(function() {


//-------------------- BODY background --------------------------------------
	var image = "paard_";
	var x = Math.floor(Math.random()*3);
	//console.log(x);
	image += x;
	//console.log(image);
	$("body").css("background-image","url(images/" + image + ".jpg)");
	

//-------------------- MENU hover --------------------------------------
	$("#menu li a").hover(function() {
		$(this).addClass("hoverTab");
	}, function() {
		$(this).removeClass("hoverTab");
	});


//-------------------- MENU curent -------------------------------------
	var temp = '';
	var number = '';
	temp = $(".content").attr("id"); //get attribute paard/hond from content
	number = temp.split("content");
	number = number[1];
	$("#menu_ul > li").eq(number - 1).addClass("currentTab"); //use attribute to addClass to according menu item


//------------------- INDICATIES ---------------------------------------
	$(".content a").click(function() {
		$(".currentLink").removeClass("currentLink"); //remove currentLink
		$(".content > div").removeClass("show").addClass("hide"); //remove SHOW, add HIDE
		var naam = $(this).attr("class"); //get classname from clicked link
		naam = naam.split(" ");
		naam = naam[0];//get first classname from many
		//console.log(naam); 

		$("#" + naam).addClass("show"); //use 'naam' to show div
		
		$(this).addClass("currentLink");		
	});


//--------------------INDICATIES hover -------------------------------
	$("#indi li a").hover(function() {
		$(this).addClass("hoverLink");
	}, function() {
		$(this).removeClass("hoverLink");
	});

	



});