var DropdownNav = Class.create({
		initialize: function(selector) {
			this.selector = selector;
			this.lis = $$(selector);
			this.ul = this.lis[0].up('ul');
			this.active = null;
			this._mouseover = this.mouseover.bindAsEventListener(this);
			Event.observe(document, 'mouseover', this._mouseover);
		},
		
		mouseover: function(event) {
			var elem = Event.element(event);
			if (elem.descendantOf(this.ul) || elem == this.ul) {
				this.show(event);				
			} else {
				this.hide();
			}
		},
		
		show : function(event) {
			var elem = Event.findElement(event, 'li');
			if (elem && (!this.active || !elem.descendantOf(this.active))) {
				this.hide();
				elem.addClassName('hover');
				this.active = elem;
			}
		},
		
		hide : function() {
			if (this.active) {
				this.active.removeClassName('hover');
				this.active = null;
			}
		}
	});
	Event.observe(window, 'load', function() {
		new DropdownNav('.product_box > ul > li', '');
	});