(function ($) {

$.fn.slidetabs = function(params) {
	defaults = {
		active: 'current', //active for the current status
		tab_wrapper: '.panel-tabs', //container of tab links
		tabs: 'a', //tabs links
		wrapper: '.panel-wrapper', //container of tab panels
		slider: '.panel-slider', //panel slider
		duration: 600,
		panels: '.panel', //selector for all panels
		current: 0
	}
	
	vars = $.extend(defaults, params);
	
	this.each(function() {
		var $this = $(this);
		var $tab_wrapper = $(vars.tab_wrapper, $this);
		var $tabs = $(vars.tabs, $tab_wrapper);
		var $wrapper = $(vars.wrapper, $this);
		var $slider = $(vars.slider, $wrapper);
		var $panels = $(vars.panels, $wrapper);
		
		//aggiungo la classe js per abilitare il css giusto...
		$this.addClass('js');
		
		//calcolo le dimensioni che mi servono...
		var viewport = $wrapper.width();		
		
		$tabs.eq(vars.current).addClass(vars.active);
		$slider.css({left:-(viewport * vars.current)});
		
		$panels.each(function() {
			var index = $panels.index(this);
			$(this).css({left: index * viewport});
		});
		
		$tabs.click(function() {
			var index = $tabs.index(this);
			$slider.animate({left:-(viewport * index)}, vars.duration, function() {
				$tabs.removeClass(vars.active);
				$tabs.eq(index).addClass(vars.active);
			});
			return false;
		});
	});
}

})(jQuery)