Pie de página de jQuery Mobile Empuje hacia la parte inferior de la página - jquery, css, jquery-mobile

Quiero tener un pie de página que siempre esté en la parte inferior de la página. De modo que cuando la página tenga un contenido corto, el pie de página será en la parte inferior de la pantalla y si el contenido es largo, entonces el pie de página será despues del contenido. ¿Cómo voy a hacer eso?

NOTA: No estoy buscando el data-position="fixed".

2^{Dakota del Norte} EDITAR: ¿Hay alguna otra forma de obtener lo que quiero? Yo he tratado El truco de Ryan Fait pero desafortunadamente, no me funcionó. La página ya no se puede desplazar. Entonces, ¿hay alguna otra forma?

Respuestas

Puede establecer el atributo de altura mínima de la jQMcontenido div para lograr esto. A continuación, la función SetMinHeight calcula la altura mínima para el div de contenido que llenaría la altura del dispositivo dado. Luego lo llama en pagecontainershow y siempre que la ventana cambia de tamaño o la orientación cambia:

$(document).on("pagecontainershow", function () {
SetMinHeight();
});

$(window).on("resize orientationchange", function () {
SetMinHeight();
});

function SetMinHeight() {
var screen = $.mobile.getScreenHeight();
var header = $(".ui-header").hasClass("ui-header-fixed") ? $(".ui-header").outerHeight() - 1 : $(".ui-header").outerHeight();
var footer = $(".ui-footer").hasClass("ui-footer-fixed") ? $(".ui-footer").outerHeight() - 1 : $(".ui-footer").outerHeight();
var contentCurrent = $(".ui-content").outerHeight() - $(".ui-content").height();

var content = screen - header - footer - contentCurrent;
$(".ui-content").css("min-height", content + "px");
}

Aquí hay un MANIFESTACIÓN

Intente cambiar el tamaño del panel en la demostración y verá que el pie de página solo se desactiva cuando el contenido ya no se ajusta a la pantalla.

Sí, debería ser compatible con jquery mobile y seguro.

Puedes probar tu sitio en dispositivos móviles con una extensión de Chrome agradable llamada Ripple

Extensión de la ondulación, se puede encontrar aquí!

La parte divertida de esta extensión es el hecho de que también puedes usar tus herramientas de desarrollador de Chrome para modificar sobre la marcha. Múltiples opciones de emulador para muchos dispositivos.