$j(document).ready(function() {

	function onBefore() { 
		nextActiveImage = $j(this).attr('class');
		nextActiveTab = nextActiveImage.replace('img-', 'tab-');
		nextActiveTabNo = nextActiveTab.replace('tab-', '');
		
		if ('1' == nextActiveTabNo){
			$j('#carousel-tab-2').removeClass('active-tab');
			$j('#carousel-tab-3').removeClass('active-tab');
		}else if('2' == nextActiveTabNo){
			$j('#carousel-tab-1').removeClass('active-tab');
			$j('#carousel-tab-3').removeClass('active-tab');
		}else if('3' == nextActiveTabNo){
			$j('#carousel-tab-1').removeClass('active-tab');
			$j('#carousel-tab-2').removeClass('active-tab');
		}
		
		$j('#carousel-' + nextActiveTab).addClass('active-tab');
	};

	$j('#carousel-images').cycle({ 
		fx:     'fade', 
		timeout: 3000,
		pause:   1,
		before:  onBefore
	});
	
	
	$j('#carousel-tab-1').hover(function() { 
		$j('#carousel-images').cycle(0);
		$j('#carousel-images').cycle('pause');
		return false; 
	},
	function(){
		$j('#carousel-images').cycle('resume');
		return false; 
	});
	
	$j('#carousel-tab-2').hover(function() { 
		$j('#carousel-images').cycle(1);
		$j('#carousel-images').cycle('pause');
		return false; 
	},
	function(){
		$j('#carousel-images').cycle('resume');
		return false; 
	});
	
	$j('#carousel-tab-3').hover(function() { 
		$j('#carousel-images').cycle(2);
		$j('#carousel-images').cycle('pause');
		return false; 
	},
	function(){
		$j('#carousel-images').cycle('resume');
		return false; 
	});

});