var theDivs = Array('home', 'about', 'services', 'contact', 'links', 'footer');
var divHeight = new Array();
var lastDiv;
                       
// the onload event handler that starts the fading.  Also adjusts the padding in to prevent sticky footer from coming up to far.
function startPage() {
        lastDiv = 'home';
		//get initial heights of all divs that have content
		i=0;
		while (i < theDivs.length)	{
			var v = theDivs[i];
			divHeight[v] = $(v).getHeight();
			i++;
		}
		$('home').appear({ duration:1, from:0.0, to:1.0 });
		$('footer').appear({ duration:1, from:0.0, to:1.0 });
		$('homeLink').addClassName('current');
		adjustLayout('home');
}

// the function that performs the crossfade (note used current instead of selected so button doesn't loose focus and change color unless the uses chooses a new secion
function changeDiv(divIn) {
	if (lastDiv != divIn) {
		//fade current div
		$(lastDiv).fade({ duration:1, from:1.0, to:0.0 });
		//remove button style
		$(lastDiv + 'Link').removeClassName('current');
		//crossfade (appear) new div
        $(divIn).appear({ duration:1, from:0.0, to:1.0 });
		//add button style for menu
		$(divIn + 'Link').addClassName('current');
		//change padding to prevent sticky footer from covering content
		adjustLayout(divIn);
		//set global variable to compare and do nothing if same button is pushed
		lastDiv = divIn;
	}
}

function adjustLayout(divIn)	{
	var divInHeight = divHeight[divIn];
		
	$('content').setStyle({
		 paddingBottom: divInHeight + 'px'
		});
}
