// JavaScript Document
$(function(){
	var $imageToShow;
	var $headerImage = $('#headerImage');
	$headerImage.append('<img id="pr" class="headerFadeImage" src="/img/pr_header.jpg" /><img id="marketing" class="headerFadeImage" src="/img/marketing_header.jpg" /><img id="management" class="headerFadeImage" src="/img/management_header.jpg" /><img id="itdesign" class="headerFadeImage" src="/img/itdesign_header.jpg" />')
	
	$('#sitelinks li a').hover(
		function(e){
			switch($(this).closest('li').attr('id')){
				case 'saucepr':
					$imageToShow = $headerImage.find('#pr');
					$imageToShow.stop(true, true).fadeIn();
					break;
				case 'saucemarketing':
					$imageToShow = $headerImage.find('#marketing');
					$imageToShow.stop(true, true).fadeIn();
					break;
				case 'saucemanagement':
					$imageToShow = $headerImage.find('#management');
					$imageToShow.stop(true, true).fadeIn();
					break;
				case 'sauceitdesign':
					$imageToShow = $headerImage.find('#itdesign');
					$imageToShow.stop(true, true).fadeIn();
					break;
			}
		}, 
		function(e){
			$imageToShow.stop(true, true).fadeOut();
		}
	);
});