/*
NOTE: This Navigation Code only applies if all of your main links
are the same height and same margin-top. 

You need to set the starting top value of the very first hint
below by adding the following 

TOP CSS VALUE of #link-holder
+
PADDING-TOP of #navigation
+
MARGIN-TOP of #navigation a


After adding assign it to variable originalHintTop.

*/
$(document).ready(function() {




	// TOP VALUE FOR CSS #hint
	var originalHintTop = 233;





//BEGIN CODE....
<!-- MAIN NAVIGATION HEADER--->  
	$('#navigation a').mouseover(function() {				
		//SETTING UP THE VARIABLES		
		//GET MARGIN-TOP
		var marginTop = $(this).css('margin-top');
		var MarginTopLength = marginTop.length;		
		var marginTopValue;
		
		//GET LINE HEIGHT
		var lineHeight = $(this).css('height');
		var lineHeightLength = lineHeight.length;		
		var lineHeightValue;
				
		//GET TOP VALUE ON CSS
		var topnumber = $('#hint').css('top');		
		var topLength = topnumber.length;		
		var topValue;
		
		//TRIMMING OUT THE 'px' in the String
		
		//top value
		for (i=0;i<topLength-2;i++)
		{
			if(i == 0)
				topValue = topnumber[i];
			else
				topValue = topValue + topnumber[i];
		}
		//margin-top value
		for (i=0;i<MarginTopLength-2;i++)
		{
			if(i == 0)
				marginTopValue = marginTop[i];
			else
				marginTopValue = marginTopValue + marginTop[i];
		}
		//line height value
		for (i=0;i<lineHeightLength-2;i++)
		{
			if(i == 0)
				lineHeightValue = lineHeight[i];
			else
				lineHeightValue = lineHeightValue + lineHeight[i];
		}
		
		//GETTING THE PRIORITY ATTR from HTML
		var priorityValue = $(this).attr('priority');
		priorityValue = priorityValue - 1;
		
		//GETTING THE DESCRIPTION
		var description = $(this).attr('desc');
		
		if(priorityValue <= 0)
			$('#hint').css('top',originalHintTop +'px');
		else{
			priorityValue = priorityValue * (parseInt(lineHeightValue) + parseInt(marginTopValue));
			priorityValue = priorityValue + parseInt(topValue);				
			$('#hint').css('top',priorityValue +'px');
		}
		
		$('#hint').html(description);
		$('#hint').css('display','block');	
	  });
	  
	$("#navigation a").mouseout(function() {
		$('#hint').css('top',originalHintTop + 'px');
		$('#hint').css('display','none');	
	  });		
	
	//OPACITY SWAPS
	$('.img-link').mouseover(function() {
		$(this).css('opacity','0.9');
		$(this).css('filter','alpha(opacity=90)');
	  });
	  
	$(".img-link").mouseout(function() {
		$(this).css('opacity','1');
		$(this).css('filter','alpha(opacity=100)');
	  });
	
});//END O READY FUNCTION