jQuery.fn.movingbox = function(options){
	var settings = {
		speed: 300,
		visibleItem : 7
	};
	
	var base = this;
	var num  = 0;
	
	this.moveLeft = function(arrow) {
		
		var left = parseInt(base.find('.movingbox-bar').css('left').replace('px',''));
		var sizes = base.data('sizes');
		
		if (num + settings.visibleItem +1 > sizes.length) {
			return;
		}
		
		var new_left = left - sizes[num];
		
		base.find('.movingbox-bar').animate({left : new_left},settings.speed,function(){
			
		});
		num++;
	}
	
	this.moveRight = function(arrow) {
		if (num == 0) {
			return;
		}
		num--;
		var left = parseInt(base.find('.movingbox-bar').css('left').replace('px',''));
		var sizes = base.data('sizes');
		
		var new_left = left + sizes[num];
		
		base.find('.movingbox-bar').animate({left : new_left},settings.speed,function(){
			
		});
		
	}
	
	settings = jQuery.extend(settings, options || {});
	
	return this.each(function() {
		var _this = jQuery(this);
		
		var items = _this.children();
		var sizes = new Array();
		var widthBar = 0;
		var maxH = -1;
		
		for (var i=0; i < items.length; i++) {
			
			sizes.push($(items[i]).outerWidth());
			$('img',items[i])
			widthBar += $(items[i]).outerWidth();
			if (maxH == -1 || $(items[i]).height() > maxH) {
				maxH = $(items[i]).height();
			}
			
			$(items[i]).css({
				'float' : 'left'
			});
		}
		
		_this.data('sizes',sizes);
		
		_this.css({
			'overflow' : 'hidden',
			'position' : 'relative'
		});
		
		if (widthBar < _this.width()) {
			widthBar = _this.width();
		}
		
		var moveBox = $('<div class="movingbox-bar"/>').css({
			position : 'absolute',
			left     : '0px',
			width    : widthBar+'px'
		});
		
		moveBox.html(_this.html());
		_this.html('');
		_this.append(moveBox);
	});
}
