var ImageMenu = new Class({
	initialize: function(elements)
	{
		this.elements = $$(elements);
		this.elements.setOpacity(0.5);
		this.widths = {};
		this.widths.closed = this.elements[0].getStyle('width').toInt();
		this.widths.openSelected = 300;
		this.widths.openOthers = Math.round((((this.widths.closed+5)*this.elements.length) - this.widths.openSelected) / (this.elements.length-1))
		this.fx = new Fx.Elements(this.elements, {wait: false, duration: 300, transition: Fx.Transitions.quadOut});
		this.elements.each(function(el,i)
		{
			el.addEvent('mouseenter', function(e) { el.setOpacity(1); new Event(e).stop(); this.reset(i); }.bind(this));
			el.addEvent('mouseleave', function(e) { new Event(e).stop(); this.reset(null); el.setOpacity(0.5); }.bind(this));
		}.bind(this));
	},
	
	reset: function(num)
	{
		if(num != null)
			var width = this.widths.openOthers;
		else
			var width = this.widths.closed;
		var obj = {};
		this.elements.each(function(el,i) { obj[i] = {'width': width}; }.bind(this));
		if(num != null)
			obj[num] = {'width': this.widths.openSelected};
		this.fx.start(obj);
	}
});