// Window load event used just in case window height is dependant upon images
$(window)
		.bind(
				"load",
				function() {
					var footerHeight = 0, footerTop = 0, $footer = $("#pageFooter");
					positionFooter();

					function positionFooter() {
						footerHeight = $footer.height() + 14;
						footerTop = ($(window).scrollTop() + $(window).height() - footerHeight)
								+ "px";

						if (($(document.body).height() + footerHeight) < $(
								window).height()) {
							$footer.css({
								position : "absolute"
							}).animate({
								top : footerTop
							});
						} else {
							$footer.css({
								position : "static"
							});
						}
					}
					$(window).scroll(positionFooter).resize(positionFooter);
				});
$(document).ready(function() {
	$("ul.thumb li").hover(function() {
		$(this).css({
			'z-index' : '1000'
		}); /* Add a higher z-index value so this image stays on top */
		$(this).find('img').addClass("hover").stop() /*
														 * Add class of "hover",
														 * then stop animation
														 * queue buildup
														 */
		.animate({
			marginTop : '-520px', /*
									 * The next 4 lines will vertically align
									 * this image
									 */
			marginLeft : '-480px',
			top : '50%',
			left : '50%',
			width : '640px', /* Set new width */
			height : '480px', /* Set new height */
			padding : '20px'
		}, 200); /*
					 * this value of "200" is the speed of how fast/slow this
					 * hover animates
					 */

	}, function() {
		$(this).css({
			'z-index' : '0'
		}); /* Set z-index back to 0 */
		$(this).find('img').removeClass("hover").stop() /*
														 * Remove the "hover"
														 * class , then stop
														 * animation queue
														 * buildup
														 */
		.animate({
			marginTop : '0', /* Set alignment back to default */
			marginLeft : '0',
			top : '0',
			left : '0',
			width : '90px', /* Set width back to default */
			height : '90px', /* Set height back to default */
			padding : '5px'
		}, 400);
	});
});