window.addEvent('domready', function() { 


	
	
	//otro
	
	// Let's define some variables first
	var ou_layer = $('fotillos'); // The outer ou_layer
	var in_layer = $('lay_fotillos'); // The inner ou_layer
	var img_items = $$('#lay_fotillos li'); // cuenta los divs contenedores
	var img_width = 82; // lo que mide cada elemento que se movera
	var max_margen = img_items.length * img_width;
	if( img_items.length > 4){
		// Seleccionamos la animación
		var movilizacion = new Fx.Tween(in_layer, {duration: 500});
		// avanzar
		function sig_foto(pos){
			if(pos == -max_margen+328){
				movilizacion.start('left', 0);
			} else { 
				var nue_posicio = pos - img_width;
				movilizacion.start('left', nue_posicio);
			}
		}
		// retroceder
		function ant_foto(pos){
			if(pos == 0){
				movilizacion.start('left', -max_margen+328);
			} else { 
				var nue_posicio = pos + img_width;
				movilizacion.start('left', nue_posicio);
			}
		}
		// marcamos los botones siguiente y anterior
		$('posterior').addEvent('click', function(){
			var posicion = parseInt(in_layer.getStyle('left'));
			sig_foto(posicion);
		});
		$('anterior').addEvent('click', function(){
			var posicion = parseInt(in_layer.getStyle('left'));
			ant_foto(posicion);
		});	
	}
});