var originalTabTop;
function updateTabPosition()
{
	var scrollTop = document.body.scrollTop;
	if(!scrollTop) {
		scrollTop = document.documentElement.scrollTop;
	}
			
	var currentPosition = $j('#floatingTab').position().top;
	var diff = -(currentPosition - originalTabTop - scrollTop);
					
	$j("#floatingTab").animate({"top": "+=" + diff + "px"}, {queue:false, duration:500});
	$j("#hiddenTab").animate({"top": "+=" + diff + "px"}, {queue:false, duration:500});
}
	
var floatingTabHidden = true;
$j(document).ready(function() {
	originalTabTop = $j('#floatingTab').position().top;
		
	$j('#floatingTab').click(function() {
		var widthOfHiddenTab = $j("#hiddenTab").width();
  		if(floatingTabHidden) {
  			floatingTabHidden = false;
  			$j("#floatingTab").animate({"left": "+=" + widthOfHiddenTab + "px"}, {queue:false, duration:200});
  			//$j("#hiddenTab").animate({"left": "+=" + widthOfHiddenTab + "px"}, {queue:false, duration:200});
			document.getElementById("hiddenTab").style.visibility='visible';
			$j("#hiddenTab")[0].style.left=$j("#floatingTab")[0].style.left;
			$j("#floatingTab").removeClass("inactiveFloatingTab");
			$j("#floatingTab").addClass("activeFloatingTab");
  			//$j("#hiddenTab")[0].style.visiblity='visible';
  		}
  		else {
  			floatingTabHidden = true;
  			$j("#floatingTab").animate({"left": "+=" + -widthOfHiddenTab + "px"}, {queue:false, duration:200});
  			$j("#hiddenTab").animate({"left": "+=" + -widthOfHiddenTab + "px"}, {queue:false, duration:200});
			document.getElementById("hiddenTab").style.visibility='hidden';
  			//$j("#hiddenTab")[0].style.visiblity='hidden';
			$j("#floatingTab").removeClass("activeFloatingTab");
			$j("#floatingTab").addClass("inactiveFloatingTab");
  		}
	});

	setInterval("updateTabPosition()", 500);
});