$.fn.botonear = function (botonera){


	botonera = this;

	posx = 0;
	var timeOut = 0;
	
	seleccionado = this.children("ul").children("li").children("a.select");
	ocultarTodos();
	

	this.children("ul").children("li").children("a").hover(
		function(){
			
			// oculto todo
			ocultarTodos();
			submenu = $(this).parent().children("ul");
			submenu.css("display","block");
			
			posx = $(this).position().left - (submenu.width() / 2) + ($(this).width() / 2);
			
			if(posx < 0){
				posx = 40;
			}
			if(posx > botonera.width() - 40 - submenu.width()){
				posx = botonera.width() - 40 - submenu.width();
			}
			
			submenu.css("left", posx);
			flechar(this);
		},
		function(){
		
			timeOut = setInterval(ocultarTodos,2000);
		}
	)
	
	this.children("ul").children("li").children("ul").hover(
		
		function(){
			// detengo timer asi no me oculta el item sobre el cual estoy parado
			clearInterval(timeOut);
		},
		
		function(){
			timeOut = setInterval(ocultarTodos,500);
	})
	
	function ocultarTodos (){
		botonera.children("ul").children("li").children("ul").css("display","none");
		flechar(seleccionado);
		clearInterval(timeOut);
	}
	
	function flechar(btn){

		distancia = $(btn).position().left + $(btn).width() / 2 - botonera.children(".separador").children("img").width() / 2;
		botonera.children(".separador").children("img").stop().animate({marginLeft:distancia},250);
	}
	
}
