function Slider(id, speed) {
	/* Константы */
	this.STATUS_UP = 0;
	this.STATUS_PROCESS = 1;
	this.STATUS_DOWN = 2;
	
	this.status = this.STATUS_UP;
	this.id = id;
	this.speed = (speed)?speed:5;
	this.height = 0;
	this.rootElement = document.getElementById(id); //LI
	this.maxHeight = this.rootElement.getElementsByTagName('LI').length * 30;
	var ev = (this.rootElement.childNodes[1])?this.rootElement.childNodes[1]:this.rootElement.firstChild;
	addEvent('mouseout', ev, this);
	this.animator = false;
}

Slider.prototype.handleEvent = function(e) {
	if (e.type == 'mouseout') {
		var x = e.clientX;
		var y = e.clientY;
		var element =  (this.rootElement.childNodes[1])?this.rootElement.childNodes[1]:this.rootElement.firstChild;
		var bounds = getBounds(element);
		var cx = bounds.left;
		var cy = bounds.top;
		var cx1 = cx+bounds.width;
		var cy1 = cy+bounds.height;
		if (x>cx && x<cx1 && y>cy && y<cy1) return false;		
		this.up();
	}
	
}

Slider.prototype._removeInterval = function() {
	if (this.status == this.STATUS_PROCESS) {
		if (this.animator != false) {
			window.clearInterval(this.animator);
			this.animator = false;
		}
	}
}

Slider.prototype.up = function() {
	if (this.status == this.STATUS_UP) return;
	this._removeInterval();
	this.status = this.STATUS_PROCESS;
	var f = this;
	this.animator = window.setInterval(function(){f.stepUp()}, 1);
}

Slider.prototype.down = function() {
	if (this.status == this.STATUS_DOWN) return;
	this._removeInterval();
	this.status = this.STATUS_PROCESS;
	var f = this;
	this.animator = window.setInterval(function(){f.stepDown()}, 1);
}

Slider.prototype.paint = function() {
	if (this.rootElement.childNodes[1]) {
		this.rootElement.childNodes[1].style.clip = "rect(0 auto " + this.height + "px 0)";
	} else {
		this.rootElement.firstChild.style.clip = "rect(0 auto " + this.height + "px 0)";
	}
}

Slider.prototype.stepDown = function() {
	if (this.height < this.maxHeight) {
		this.height += this.speed;
		this.paint();
	} else {
		this.animator = window.clearInterval(this.animator);
		this.status = this.STATUS_DOWN;
	}
}

Slider.prototype.stepUp = function() {
	if (this.height > 0) {
		this.height -= this.speed;
		this.paint();
	} else {
		this.animator = window.clearInterval(this.animator);
		this.status = this.STATUS_UP;
	}
}

Slider.prototype.isReady = function() {
	return this.status != this.STATUS_PROCESS;
}

function SlideMenu(id, speed) {
	
	/* Константы */
	this.STATUS_READY = 0;
	this.STATUS_PROCESS = 1;
	
	if (!speed) speed = 5;
	if (navigator.appName == "Microsoft Internet Explorer") {
		speed = speed * 1.5;
	}
	
	this.status = this.STATUS_READY;
	this.rootElement = document.getElementById(id);
	this.sliders = [];
	var elements = this.rootElement.childNodes;
	var k = 0;
	for (var i=0; i<elements.length; i++) {
		if (elements[i].nodeName == 'LI') {
			var element = elements[i];
			this.sliders[k]= new Slider(element.id, speed);
			addEvent('mouseover', element, this);
			addEvent('mouseout', element, this);
			k++;
		}
		
		
	}
	
}

SlideMenu.prototype._closeAll = function() {
	for (var i = 0; i<this.sliders.length; i++) {
		this.sliders[i].up();
	}
}

SlideMenu.prototype.handleEvent = function(e) {	
	/* Определяем индекс слайдера */
	if (e.target)
		var id = e.target.id;
	else if (e.srcElement) {
		var id = e.srcElement.id
	}
	var index = id.toString().substr(1);
	if (!index) return false;
	index = index - 1;
	
	if (e.type == 'mouseover') {
		this._closeAll();
		this.sliders[index].down();
	}
	return false;
}

function start() {
	var menu = new SlideMenu('menu', 2);
}

function addEvent(name, obj, funct) { // utility function to add event handlers

    if (navigator.appName == "Microsoft Internet Explorer") {
	//Для IE уточняем какая именно функция обрабатывает сообщение
	if (typeof(funct) == 'object') {
		obj.attachEvent("on"+name, function (e) {funct.handleEvent(e)});
	} else {
		obj.attachEvent("on"+name, funct);
	}
    } else {  // is mozilla/netscape
        obj.addEventListener(name, funct, false);
    }
}


function getBounds(element)
{
  if (navigator.appName == "Microsoft Internet Explorer") {
	var left = element.offsetLeft;
	var top = element.offsetTop;
	for (var parent = element.offsetParent; parent; parent = parent.offsetParent) {
		left += parent.offsetLeft;
		top += parent.offsetTop;
	}
  } else {
	var left = element.offsetLeft;
	var top = element.offsetTop;
  }
  return {left: left, top: top, width: element.offsetWidth, height: element.offsetHeight};
}