Sticky footer con jQuery

[bs_notification type=»success» dismissible=»false»]Hay una nueva versión de este script. Ver el articulo. [/bs_notification]

A veces no queda bien que páginas con poco contenido que no llegan a llenar una ventana (en alto) tengan el pié en medio de la ventana y dejen el resto en blanco, y se prepara para que el pié siempre esté al final, es decir: Si la página ocupa más de una ventana, al final de la página. Si no, al final de la ventana. Podéis verlo en los ejemplos de Bootstrap.

Quería usarlo en la Web que estoy preparando para Paradise Sandbox, donde creo que sí toca utilizar esta técnica. Hasta ahora había utilizado un entramado de capas y propiedades CSS que nunca me ha gustado, pero por pereza de buscar o preparar alternativas y por no necesitar utilizarlo en muchas ocasiones, no me había esforzado mucho en el tema, con esta web es diferente. La hago por amor al arte, para lucirme y disfrutar de mi oficio sin prisas ni presiones.

Al buscar, lo primero que he visto es un Snippet de Chris Coyier en CSS-Tricks, pero no acababa de funcionar bien (yo diría que un pequeño problema de concepto) así que lo he modificado, y ahora funciona como toca.

function stickyFooter(){

	var	footerHeight	= 0,
		footerTop	= 0,
		$footer		= $("#footer");

	$footer.css("position","static");

	footerHeight	= 	parseInt($footer.height()) +
				parseInt($footer.css("padding-top")) +
				parseInt($footer.css("padding-bottom"));
	footerTop	= ( $(window).scrollTop() +
			    $(window).height() -
			    footerHeight) + "px";

	$footer.css("position","static");

	if ( ($(document.body).height()) < $(window).height()) {
		$footer.css({
			"position":"absolute",
			"top":footerTop,
			"width":"100%"
		});
	} else {
		$footer.css("position","static");
	}
}

La función stickyFooter(); debería ejecutarse al renderizar la página y cada vez que el tamaño de la ventana o el documento cambien, para eso se usará el listener resize del elemento $(window).

$(function() {
	$(window).resize(function() {
		stickyFooter();
	});
}

Y poco más, voy a seguir viendo Django.