function displayTopMenu(navid) // udføres ved load
{
  var isie = typeof document.all != 'undefined'
     && typeof window.opera == 'undefined'
     && navigator.vendor != 'KDE';

  if (typeof document.getElementById == 'undefined'
      || (navigator.vendor == 'Apple Computer, Inc.'
      && typeof window.XMLHttpRequest == 'undefined')
      || (isie && typeof document.uniqueID == 'undefined'))
  {
    return;  
  }

  var tree = document.getElementById(navid);
  if (tree)
  {
    branch = tree;
    var items = tree.getElementsByTagName('li');
    for (var i = 0; i < items.length; i++)
    {
      dropdownTrigger(tree, items[i], navid, isie); // tree = det element, der udgør menuen
	  												// navid = id'en på menuen
    }
  }
}

function dropdownTrigger(tree, li, navid, isie)
{
  var a = li.getElementsByTagName('a')[0];
  var menu = li.getElementsByTagName('ul').length > 0
      ? li.getElementsByTagName('ul')[0] : null;
	  // hvis der er en undermenu bliver menu sat til ul-elementet - ellers null
  var horiz = tree.className.indexOf('horizontal') != -1;
  // if (....) horiz = true else horiz = false
  // kunne man ikke bare skrive: if tree.className == 'horizontal' { var horiz = true } else .... Prøv senere
  var issub = li.parentNode.id == navid; 
  // if (...) issub = true else issub = false
  // true = first level, false = deeper

  if (menu) // hvis der er en submenu
  {
    li.className += (li.className == '' ? '' : ' ') + 'hasmenu';
	// der tilføjes et className (og en blank hvis der er et className i forvejen)
  }

  attachEventListener(li, 'mouseover', function(e)  
  // tilføj følgende event-listener ved mouseover på listeelementet
  {
    a.className += (a.className == '' ? '' : ' ') + 'rollover'; // for at kunne highligthe

	if (menu) // hvis der er en undermenu
    {
	    menu.style.left = horiz ? 
			'auto'  // rettelse til ære for IE7 - erstatter linien nedenfor
			//(isie ? li.offsetLeft + 'px' : 'auto') 
            : '0';
		// horiz er en betingelse - hvis den er true så sættes menuens left til den omsluttende LI's 
		// aktuelle position eller auto alt efter om det er ie eller ej
		// hvis hiriz er falsk sættes menuens left til 0
		// I alle andre end IE er position relative i lister, se JSA side 331 nederst

        menu.style.top = horiz && issub ? 
			'auto'  // rettelse til ære for IE7 - erstatter linien nedenfor
			//(isie ? a.offsetHeight + 'px' : 'auto')
            : (isie ? li.offsetTop + 'px' : '0');
		// hvis horiz er true og det er den øverste menu
		// så sættes menuens top a-taggens aktuelle højde (rykkes højden ned) eller auto 
		// ellers sættes menuens top til listelementets aktuelle top eller 0 
		// Det er kun placering af den første undermenu der skiller horizontal fra vertical 
		// længere ned i hierarkiet er de to principper ens
		
	}
  }, false);

  attachEventListener(li, 'mouseout', function(e)
  {
    var related = typeof e.relatedTarget != 'undefined' ? e.relatedTarget : window.event.toElement;
    if (!li.contains(related))
	// if det element cursoren er på vej ind i ikke er indeholdt i listeelementet så er det en ægte mouseout
    {
      // clearTimeout(opentime);
      branch = li;
		// ovenstående to linier er senere
		
      a.className = a.className.replace(/ ?rollover/g, '');  // fjern rollover className
      if (menu) // hvis der er en undermenu
      {
        
        {
          menu.style.left = '-100em';  // flyt ud i det blå
		}
	  }
	}
  }, false);

  if (!isie) 										
  // se JSA side 333 øverst
  // Det handler om, at det kun er IE der udfører contains rigtigt
  // For alle andre browsere må vi tilføje en contains function selv
  // Funktionen er recursive og kører opaf i DOMen 
  {													
    li.contains = function(node)
    {
      if (node == null) { return false; } // ikke indeholdt
      if (node == this) { return true; }  // er indeholdt da det er den samme
      else { return this.contains(node.parentNode); } // udfører denne function et niveau oppe
    };
  }													
}


function attachEventListener(target, eventType, functionRef, capture)
{
  if (typeof target.addEventListener != 'undefined')
  {
    target.addEventListener(eventType, functionRef, capture);
  }
  else if (typeof target.attachEvent != 'undefined')
  {
    target.attachEvent('on' + eventType, functionRef);
  }
  else
  {
    eventType = 'on' + eventType;

    if (typeof target[eventType] == 'function')
    {
      var oldListener = target[eventType];

      target[eventType] = function()
      {
        oldListener();

        return functionRef();
      }
    }
    else
    {
      target[eventType] = functionRef;
    }
  }

  return true;
}

function addLoadListener(fn)
{
  if (typeof window.addEventListener != 'undefined')
  {
    window.addEventListener('load', fn, false);
  }
  else if (typeof document.addEventListener != 'undefined')
  {
    document.addEventListener('load', fn, false);
  }
  else if (typeof window.attachEvent != 'undefined')
  {
    window.attachEvent('onload', fn);
  }
  else
  {
    var oldfn = window.onload;
    if (typeof window.onload != 'function')
    {
      window.onload = fn;
    }
    else
    {
      window.onload = function()
      {
        oldfn();
        fn();
      };
    }
  }
}

addLoadListener(function() { displayTopMenu('topMenu'); });