var mFx = new Class({
	
	initialize: function(options)
	{
		if ($chk($('middle').getElement('ul'))) {
			
			var fxs = [];			
			
			var li_array = $('middle').getElements('li')
			
			li_array.each(function(el, i){
														
				fxs[i] = new Fx.Style(el.getElement('span'), 'background-position', {
					duration:250,
					wait:true,
					transition: Fx.Transitions.Cubic.easeInOut
				}).set(-50);
														
				el.addEvents({
					'mouseenter': function(){ 		
						fxs.each(function(el2,j){ if (i!=j) el2.set(-50)});										
						fxs[i].start(10);
					},
					'mouseleave': function(){ 		
						fxs[i].start(-50);
					}				
				});
			});
			
//			$('middle_wrapper').addEvent('mouseenter', function(){ fxs.each(function(el){ el.set(-50)})});	
			$('middle_wrapper').addEvent('mouseleave', function(){ fxs.each(function(el){ el.set(-50)})});				
		}
	}
});

mFx.implement(new Options);

window.addEvent('domready', function(){
	new mFx();	
});