function webClient() {

  var i;

  this.IE    = false;
  this.NS    = false;
  this.OP    = false;
  this.release = null;

  if ((i = navigator.userAgent.indexOf("Opera")) >= 0) {
    this.OP = true;
    this.version = parseFloat(navigator.userAgent.substr(i + 5));
    return;
  }


  if ((i = navigator.userAgent.indexOf("MSIE")) >= 0) {
    this.IE = true;
    this.release = parseFloat(navigator.userAgent.substr(i + 4));
    return;
  }

  if ((i = navigator.userAgent.indexOf("Netscape6/")) >= 0) {
    this.NS = true;
    this.release = parseFloat(navigator.userAgent.substr(i + 10));
    return;
  }

  if ((i = navigator.userAgent.indexOf("Netscape7/")) >= 0) {
    this.NS = true;
    this.release = parseFloat(navigator.userAgent.substr(i + 10));
    return;
  }

  if ((i = navigator.userAgent.indexOf("Gecko")) >= 0) {
    this.NS = true;
    this.release = 6.1;
    return;
  }
}


var webClient = new webClient();

var activeButton = null;
var activeSubButton = null;

 if (webClient.IE)
	 document.onmousedown = pageMouseDown;
  else
     document.addEventListener("mousedown", pageMouseDown, true);

function pageMouseDown(event) {

  var el;

  //if (activeButton == null)
  //  return;

  if (webClient.IE)
    el = window.event.srcElement;
  else
    el = (event.target.tagName ? event.target : event.target.parentNode);

  if (el == activeButton || el == activeSubButton)
    return;

  if (el.className != "menuButton"  && el.className != "menuItem" &&
      el.className != "menuItemSep" && el.className != "menu") {
	    if (activeButton) closeMenu(activeButton);
    	if (activeSubButton) closeSubMenu(activeSubButton);
	}
}

function menuTouch(event, menuName) {
  var button;

  if (webClient.IE)
    button = window.event.srcElement;
  else
    button = (event.target.tagName ? event.target : event.target.parentNode);

  if (!button.menu && menuName)
    button.menu = document.getElementById(menuName);

  if (activeButton && activeButton != button)
    closeMenu(activeButton);
  if (activeSubButton && activeSubButton != button)
    closeSubMenu(activeSubButton);

  if (!button.isactive)
  	if (menuName) {
	    openMenu(button);
	//} else {
	//	activeButton=button;
	//	button.isactive=true;
	//	button.className = "menuButtonActive";
	}
  return false;
}

function subMenuTouch(event, menuName) {
  var button;

  if (webClient.IE)
    button = window.event.srcElement;
  else
    button = (event.target.tagName ? event.target : event.target.parentNode);

  if (!button.menu && menuName)
    button.menu = document.getElementById(menuName);

  if (activeSubButton && activeSubButton != button)
    closeSubMenu(activeSubButton);

  if (!button.isactive && menuName)
    openSubMenu(button);

  return false;
}
/*
function openSubMenu(button) {
//naar rechts
  var w, dw, x, y;

  button.className = "menuItemActive";

  if (webClient.IE && !button.menu.firstChild.style.width) {
    w = button.menu.firstChild.offsetWidth;
    button.menu.firstChild.style.width = w + "px";
    dw = button.menu.firstChild.offsetWidth - w;
    w -= dw;
    button.menu.firstChild.style.width = w + "px";
  }

  x = getPageOffsetLeft(button)+ button.offsetWidth;;
  y = getPageOffsetTop(button);

  x++;
  y++;

  button.menu.style.left = x + "px";
  button.menu.style.top  = y + "px";
  button.menu.style.visibility = "visible";

  button.isactive = true;
  activeSubButton = button;
}
*/

function openSubMenu(button) {
//naar links
  var w, dw, x, y;

  button.className = "menuItemActive";

  if (webClient.IE && !button.menu.firstChild.style.width) {
    w = button.menu.firstChild.offsetWidth;
    button.menu.firstChild.style.width = w + "px";
    dw = button.menu.firstChild.offsetWidth - w;
    w -= dw;
    button.menu.firstChild.style.width = w + "px";
  }

  x = getPageOffsetLeft(button)-170;
  y = getPageOffsetTop(button);

  x++;
  y++;

  button.menu.style.left = x + "px";
  button.menu.style.top  = y + "px";
  button.menu.style.visibility = "visible";

  button.isactive = true;
  activeSubButton = button;
}


/*
function openMenu(button) {
//naar rechts
  var w, dw, x, y;

  button.className = "menuButtonActive";

  if (webClient.IE && !button.menu.firstChild.style.width) {
    w = button.menu.firstChild.offsetWidth;
    button.menu.firstChild.style.width = w + "px";
    dw = button.menu.firstChild.offsetWidth - w;
    w -= dw;
    button.menu.firstChild.style.width = w + "px";
  }

  x = getPageOffsetLeft(button)+ button.offsetWidth;
  y = getPageOffsetTop(button);

  button.menu.style.left = x + "px";
  button.menu.style.top  = y + "px";
  button.menu.style.visibility = "visible";

  button.isactive = true;
  activeButton = button;
}
*/

function openMenu(button) {
//naar links
  var w, dw, x, y;

  button.className = "menuButtonActive";

  if (webClient.IE && !button.menu.firstChild.style.width) {
    w = button.menu.firstChild.offsetWidth;
    button.menu.firstChild.style.width = w + "px";
    dw = button.menu.firstChild.offsetWidth - w;
    w -= dw;
    button.menu.firstChild.style.width = w + "px";
  }

  x = getPageOffsetLeft(button)-174;
  y = getPageOffsetTop(button);

  button.menu.style.left = x + "px";
  button.menu.style.top  = y + "px";
  button.menu.style.visibility = "visible";

  button.isactive = true;
  activeButton = button;
}


function closeMenu(button) {
  button.className = "menuButton";

  if (button.menu) button.menu.style.visibility = "hidden";

  button.isactive = false;
  activeButton = null;
}

function closeSubMenu(button) {
  button.className = "menuItem";

  if (button.menu) button.menu.style.visibility = "hidden";

  button.isactive = false;
  activeSubButton = null;
}


function getPageOffsetLeft(el) {
  return el.offsetLeft + (el.offsetParent ? getPageOffsetLeft(el.offsetParent) : 0);
}

function getPageOffsetTop(el) {
  return el.offsetTop + (el.offsetParent ? getPageOffsetTop(el.offsetParent) : 0);
}


function showmenu()
{
var hugmenu;

hugmenu = "<div id='overons' class='menu'>" +
	"<a class='menuItem'  href='overons/doelstelling.html' onmouseover='return subMenuTouch(event, '');'>Doelstelling</a>" +
	"<a class='menuItem'  href='overons/bestuur.html' onmouseover='return subMenuTouch(event, '');'>Bestuur</a>" +
	"<a class='menuItem'  href='overons/ontstaan.html' onmouseover='return subMenuTouch(event, '');'>Ontstaan</a>" +
	"</div>" +
	"<div id='projecten' class='menu'>" +
	"<a class='menuItem'  href='projecten/tandartsen.html' onmouseover='return subMenuTouch(event, '');'>Tandartsenproject</a>" +
	"<a class='menuItem'  href='projecten/noahsark.html' onmouseover='return subMenuTouch(event, '');'>Noah's ark</a>" +
	"<a class='menuItem'  href='#' onmouseover='return subMenuTouch(event, 'polota');'>Medisch centrum Polota</a>" +
	"<a class='menuItem'  href='projecten/sureprospect.html' onmouseover='return subMenuTouch(event, '');'>Sure Prospect Institute</a>" +
	"<a class='menuItem'  href='projecten/leprazh.html' onmouseover='return subMenuTouch(event, '');'>Lepra Ziekenhuis</a>" +
	"</div>" +
	"<div id='nieuws' class='menu'>" +
	"<a class='menuItem'  href='nieuws/nieuwsfeiten.html' onmouseover='return subMenuTouch(event, '');'>Nieuwsfeiten</a>" +
	"<a class='menuItem'  href='nieuws/huginnieuws.html' onmouseover='return subMenuTouch(event, '');'>HUG in het nieuws</a>" +
	"</div>" +
	"<div id='acties' class='menu'>" +
	"<a class='menuItem'  href='acties/acties.html' onmouseover='return subMenuTouch(event, '');'>Losse Acties</a>" +
	"<a class='menuItem'  href='acties/vrg-aanb.html' onmouseover='return subMenuTouch(event, '');'>Vraag en Aanbod</a>" +
	"<a class='menuItem'  href='acties/dozen.html' onmouseover='return subMenuTouch(event, '');'>Goede Doelendozen</a>" +
	"</div>" +
	"<div id='archief' class='menu'>" +
	"<a class='menuItem'  href='archief/arch_acties.html' onmouseover='return subMenuTouch(event, '');'>Acties</a>" +
	"<a class='menuItem'  href='archief/arch_projecten.html' onmouseover='return subMenuTouch(event, '');'>Projecten</a>" +
	"<a class='menuItem'  href='archief/arch_nieuws.html' onmouseover='return subMenuTouch(event, '');'>Nieuws</a>" +
	"</div>" +
	"<div id='polota' class='menu'>" +
	"<a class='menuItem'  href='projecten/mcpolota.html'>Medisch Centrum</a>" +
	"<a class='menuItem'  href='projecten/moederkindkl.html'>Moeder-Kind kliniek</a>" +
	"</div>" +
	"<div id='nav' height='200px'>" +
	"<ul>" +
	"<li><a class='menuButton'  href='index.html' onmouseover='menuTouch(event, '');'>Home</a></li>" +
	"<li><a class='menuButton'  href='#' onmouseover='menuTouch(event, 'overons');'>Over ons</a></li>" +
	"<li><a class='menuButton'  href='#' onmouseover='menuTouch(event, 'projecten');'>De 5 projecten</a></li>" +
	"<li><a class='menuButton'  href='#' onmouseover='menuTouch(event, 'nieuws');'>Nieuws</a></li>" +
	"<li><a class='menuButton'  href='#' onmouseover='menuTouch(event, 'acties');'>Acties</a></li>" +
	"<li><a class='menuButton'  href='steun.html' onmouseover='menuTouch(event, '');'>Steun ons werk</a></li>" +
	"<li><a class='menuButton'  href='sponsors.html' onmouseover='menuTouch(event, '');'>Sponsors</a></li>" +
	"<li><a class='menuButton'  style='font-weight:bold;' href='vrijwilligers.html' onmouseover='menuTouch(event, '');'>Vrijwilligers</a></li>" +
	"<li><a class='menuButton'  href='huginuganda.html' onmouseover='menuTouch(event, '');'>HUG in Uganda</a></li>" +
	"<li><a class='menuButton'  href='infouganda.html' onmouseover='menuTouch(event, '');'>Info over Uganda</a></li>" +
	"<li><a class='menuButton'  href='contact.html' onmouseover='menuTouch(event, '');'>Contact</a></li>" +
	"<li><a class='menuButton'  href='links.html' onmouseover='menuTouch(event, '');'>Links</a></li>" +
	"<li><a class='menuButton'  href='#' onmouseover='menuTouch(event, 'archief');'>Archief</a></li>" +
	"</ul>" +
	"</div>"


document.getElementById('hugmenu').innerHTML=hugmenu;
}