// create dropdown elements:
str = "";
for (var i=1; self['menu'+i]; i++) {
	str += '<div id="drop'+i+'" class="dropdown">\n';
	for (var j=0; j<self['menu'+i].length; j+=3) {
//		str += '<div class="droplinkdiv" onclick="self.location.href=this.childNodes[0].href"><a class="droplink" href="'+self['menu'+i][j+1]+'"'+(self['menu'+i][j+2]? ' target="_blank"' : '')+'>'+self['menu'+i][j]+'</a></div>\n';
		str += '<div class="droplinkdiv"><a class="droplink" href="'+self['menu'+i][j+1]+'"'+(self['menu'+i][j+2]? ' target="_blank"' : '')+'>'+self['menu'+i][j]+'</a></div>\n';
	}
	str += '<div class="dropend"><img src="tile'+i+'lower.gif"></div>\n';
	str += '</div>\n';
}
document.write(str);

// position the menus:
function getX(el) {
	var val = (arguments[1] || 0) + el.offsetLeft;
	return el.offsetParent? val + getX(el.offsetParent) : val;
}
function getY(el) {
	var val = (arguments[1] || 0) + el.offsetTop;
	return el.offsetParent? val + getY(el.offsetParent) : val;
}
function posMenu() {
	for (var i=1; self['menu'+i]; i++) {
		var img = document.getElementById('tile'+i+'b');
		var el = document.getElementById('drop'+i);
		el.style.left = getX(img);
		el.style.top = getY(img);
	}
}
posMenu();
var oldOnload = self.onload;
onload = function(e) {
   oldOnload(e);
   posMenu();
}

onresize = posMenu;

function debug(str) {
   document.getElementById("debug").innerHTML += str+"<br>";
}

// create menu objects:
function Menu(id) {
	this.id = id;
	this.nr = id.charAt(4);
	this.show = function() {
		if (this.timer) clearTimeout(this.timer);
		document.getElementById(this.id).style.visibility = 'visible';
		document.getElementById('tile'+this.nr+'b').style.visibility = 'hidden';		
	};
	this.hide = function() {
		this.timer = setTimeout('document.getElementById("'+this.id+'").style.visibility = "hidden"; document.getElementById("tile'+this.nr+'b").style.visibility = "visible";', 100);
	};
}
menus = [];
for (var i=1; self['menu'+i]; i++) {
	menus[i] = new Menu('drop'+i);
   document.getElementById('drop'+i).innerHTML = document.getElementById('drop'+i).innerHTML;
}

// register the mouseover events:
for (var i=1; self['menu'+i]; i++) {
	var imga = document.getElementById('tile'+i+'a');
	var imgb = document.getElementById('tile'+i+'b');
	var el = document.getElementById('drop'+i);
	imga.onmouseover = imgb.onmouseover = el.onmouseover = new Function("menus["+i+"].show()");
   imga.onmouseout = imgb.onmouseout = el.onmouseout = new Function("menus["+i+"].hide()");
}