var SlideList=Class.create({initialize:function(menu,options){this.menu=$(menu),this.current=this.menu.select('li.current').first();this.menu.select('li').each(function(item){Event.observe(item,'mouseover',function(){this.moveBg(item);$("current_a").setStyle({color:'#255A9D'});}.bind(this));Event.observe(item,'mouseout',function(){this.moveBg(this.current);$("current_a").setStyle({color:'#fff'});}.bind(this));}.bind(this));new Element.insert(this.menu,'<li style="display:none;" class="background"><div class="left"></div></li>')
this.back=this.menu.select('li.background').first();if(this.current){this.setCurrent(this.current)};},setCurrent:function(el,effect){this.back.setStyle({left:(el.offsetLeft)+'px',width:(el.offsetWidth)+'px'});(effect)?this.back.hide():this.back.show();this.current=el;},clickItem:function(event,item){if(!this.current)this.setCurrent(item,true);this.current=item;this.options.onClick(new Event(event),item);},moveBg:function(to){if(!this.current){return;}
new Effect.Parallel([new Effect.Move(this.back,{sync:true,transition:Effect.Transitions.SwingTo,x:to.offsetLeft,y:0,mode:'absolute'}),new Effect.Morph(this.back,{sync:true,style:{width:to.getWidth()+'px'}})])}})
Event.observe(window,'load',function(){new SlideList('primary');});