$(document).ready(function(){
	var imgSrcList = new Array();

	//When mouse rolls over
	var heightList = new Array();
	heightList['animatedNavigation1'] = 180;
	heightList['animatedNavigation2'] = 120;
	heightList['animatedNavigation3'] = 180;
	heightList['animatedNavigation4'] = 100;
	$(".animatedNavigation").mouseover(function(){
		animatedNavigationMouseOver(heightList, imgSrcList, $(this));
	});

	var heightListACT = new Array();
	heightListACT['animatedNavigation1'] = 184;
	heightListACT['animatedNavigation2'] = 124;
	heightListACT['animatedNavigation3'] = 184;
	heightListACT['animatedNavigation4'] = 104;
	$(".animatedNavigationACT").mouseover(function(){
		animatedNavigationMouseOver(heightListACT, imgSrcList, $(this));
	});


	//When mouse is removed
	$(".animatedNavigation").mouseout(function(){
		$(this).stop().animate({height:'30px'},{queue:false, duration:300, easing: 'easeOutQuad'})
		
		//change the rolloverimage
		var elementId = $(this).attr('id');
		animatedNavigationMouseOutRollover(elementId, imgSrcList[elementId]);
	});
	$(".animatedNavigationACT").mouseout(function(){
		$(this).stop().animate({height:'34px'},{queue:false, duration:300, easing: 'easeOutQuad'})
		
		//change the rolloverimage
		var elementId = $(this).attr('id');
		animatedNavigationMouseOutRollover(elementId, imgSrcList[elementId]);
	});

});


function animatedNavigationMouseOver(heightList, imgSrcList, localThis) {
	var elementId = localThis.attr('id');
	var newHeight = heightList[elementId].toString()+'px';
	localThis.stop().animate({height:newHeight},{queue:false, duration:300, easing: 'easeOutQuad'})

	//change the rolloverimage
	var imgElement = $('#'+elementId+'-img');
	if(imgSrcList[elementId]==null) {
		var imgSrc = imgElement.attr('src');
		imgSrcList[elementId] = imgSrc;
	}
	var rolloverElement = $('#'+elementId+'-rollover');
	var rolloverSrc = rolloverElement.attr('src');
	imgElement.attr('src', rolloverSrc);
}

function animatedNavigationMouseOutRollover(elementId, imgSrc) {
	//change the rolloverimage
	var imgElement = $('#'+elementId+'-img');
	imgElement.attr('src', imgSrc);
}