$.fn.carousels = function(vars) {       
	
	var current = 0; 
	var maximum = $('ul li' , this).size(); 
	var visible = vars.items ? vars.items : 3; 
	var speed = 300; 
	var width = vars.width ? vars.width : 3;
	
	var rest = maximum%visible;
	if(rest !=0 ) maximum = (maximum-rest) + visible;
	
	var ul = $('ul' , this);  ul.css("width", (width * maximum)+"px"); <!-- Important -->
	var li = $('ul li' , this); li.mouseover(function(){ $(this).addClass('over'); }).mouseout(function(){ $(this).removeClass('over'); }); <!-- Oprional -->

	$('div.buttons span' , this).click(function() { 
		var id = $(this).attr('id');
		if(id == 'forward') {
			if(current + visible < 0 || current + visible > maximum - visible) { return false; } else {	current = current + visible; }
		} else { 
			if(current - visible < 0 || current - visible > maximum - visible) {return false; }	else { current = current - visible; }
		}
		ul.animate({left: -(width * current + 1)}, speed, null);	
		return false;
	}).mouseover(function(){ $(this).addClass('over'); }).mouseout(function(){ $(this).removeClass('over'); });

};