$(document).ready(function(){
/*
	$('.commentsToggle').click(function(){
		$('.commentlist').slideToggle("slow");
		$(this).toggleClass("active");
	});
*/
/*******************************************************************************************/	
	//borrowed from jQuery easing plugin
	//http://gsgd.co.uk/sandbox/jquery.easing.php
	// t: current time, b: begInnIng value, c: change In value, d: duration
	$.easing.easeInOutSine = function (x, t, b, c, d) {
		return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
	};

	//scroll to anchor
	$('.scrolltop').click(function(){$.scrollTo( '#top', 1000,{easing:'easeInOutSine'} );return false});
	$('.add').click(function(){$.scrollTo( '#respond', 1000,{easing:'easeInOutSine'} );return false});
	
/*******************************************************************************************/	
	// Sliding black box underneath menu items as you hover over them.
	// turned off to start with.
	$('#slidingNav_move').fadeTo(0,0);
	$('#slidingNav li:first a').addClass('cur');
	
	// If javascript is off then  this style works by default. If it's on then remove the black box...
	$('#menu li a').hover(function() {
		$(this).css("background-color","transparent");
		});

	$('#slidingNav a').hover(function() {
		// On hover.
		var offset = $(this).offset();
		var offsetBody = $('#menu').offset(); //find the offset of the wrapping div    
		// Stop any animations currently running and fade in. quickly.
		var curr = this;
		$('#slidingNav_move').stop( true ).animate( { 			
			width: $(this).width()+15, 
			height: $(this).height(), 
			left: (curr.offsetLeft) - 5
		}, 
		{ duration: 250, easing: 'easeInOutSine' });
		// fade in quickly.
		$('#slidingNav_move').fadeTo(100, 1);
		$('.cur').removeClass('cur');
		$(this).addClass('cur');
		return false;
	});
	
	$('#slidingNav').hover(function(){}, function() {
		// Off hover.
		// Stop any animations currently running and slowly fade out.
		$('#slidingNav_move').fadeTo(3000, 0);
	});
	  
	//  Change the look of the image behind the comment prompt when you hover. 
	$('.postmeta a').hover(function() {
		// On hover make the parent commentlinkwrapper image change.
		// Note that IE allows me to just set the y but firefox needs the whole thing
		$(this).parents(".commentlinkwrapper")
			.css({'background-position' : '0% -30px'});
		return false;
	},
	function() {
		// Off hover, restore
		$(this).parents(".commentlinkwrapper")
			.css({'background-position' : '0% top'});
		return false;
	});

});	// End of document.ready