window.onload = function() {
	m = document.getElementById('menu_products');
	sm = document.getElementById('sub_menu_products');
	o = new subMenu(m,sm);
}

function findPos(obj) {
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		do {
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
		} while (obj = obj.offsetParent);
	return {'x':curleft,'y':curtop};
	}
}

var subMenu = function(parent,child) {

	this.parent = parent;
	this.menu = child;
	this.visible = false;
	this.timer = false;
	this.delay = 100;
	this.parentClass = this.parent.className;
	
	var self = this;
	
	this.parent.onmouseover = function() { self.show(); };
	this.parent.onmouseout = function() { self.pend_hide(); }
	
	this.menu.onmouseover = function() { self.show(); }
	this.menu.onmouseout = function() { self.pend_hide(); }
	
	this.show = function() {
		clearTimeout(this.timer);
		if(!this.visible) {
			this.position();
			this.menu.style.display = 'block';
			this.visible = true;
			this.parentClass = this.parent.className;
			this.parent.className = 'on';
			this.visible = true;
		}
	}
	
	this.hide = function() {
		this.menu.style.display = 'none';
		this.parent.className = this.parentClass;
		this.visible = false;
	}
	
	this.pend_hide = function() {
		var self = this;
		this.timer = setTimeout(function() { self.hide(); },this.delay);
	}
	
	this.position = function() {
		var p = findPos(this.parent);
		this.menu.style.left = p.x + 'px';
		this.menu.style.top = p.y + this.parent.offsetHeight + 'px';
	}
	
}