2012-01-09 9 views
8

Estoy tratando de desarrollar una aplicación para iPhone usando PhoneGap y jQuery Mobile. Esta aplicación tiene un Fixed Footer.jQuery mobile data-page = 'content' SÓLO transición

El problema principal que estoy enfrentando en este momento es que la transición de página incorporada cambia TODA LA PÁGINA, requiriéndome copy/paste el código de pie de página en cada página.

Obviamente, esta no es la manera de hacerlo. Cualquier pequeño cambio en el pie de página debe duplicarse más de 10 veces (para más de 10 páginas).

Mi pregunta es la siguiente: ¿cómo puedo cargar solo la parte de "contenido" de la página (con una transición de diapositiva) así que no tendré que tener código de pie de página en todas mis páginas?

Respuesta

5

Esa funcionalidad aún no está disponible en jQuery Mobile. Puede activar la opción touchOverflowEnabled para pies de página fijos y fijos "reales" en dispositivos iOS 5 pero no para otros dispositivos.

Para lograr verdaderas barras de herramientas fijas, un navegador necesita ya sea posición de soporte: fijo o desbordamiento: automático. Afortunadamente, este soporte es que llega a las plataformas móviles para que podamos lograrlo con los estándares web. En jQuery Mobile, hemos agregado una función global llamada touchOverflowEnabled que aprovecha el desbordamiento: propiedad automática de CSS en plataformas compatibles con como iOS5. Cuando está habilitado, el marco envuelve cada página en un contenedor con su propio desplazamiento interno. Esto nos permite posicionar las barras de herramientas fuera del cuerpo de desplazamiento para que permanezcan realmente fijadas en su lugar en todo momento.

Fuente: http://jquerymobile.com/demos/1.0/docs/toolbars/bars-fixed.html

Usted puede sin embargo configurar sus pies de página en una casa programática en lugar de la codificación dura de cada página:

//bind an event handler to the `pagecreate` event for all `data-role="page"` elements 
$(document).delegate('[data-role="page"]', 'pagecreate', function() { 

    //append a footer to this page (`pagecreate` is only called once per page added to the DOM so you don't have to worry about appending multiple footers to a single page 
    $(this).append('<div data-id="my-fixed-footer" data-position="fixed" data-role="footer">{THE HTML FOR YOUR FOOTER GOES HERE}</div>'); 
}); 

Aquí es una demostración: http://jsfiddle.net/vNqaG/ (Aviso no hay pies de página codificados en el panel HTML)

-5

I Si está utilizando una base de datos en la aplicación web, simplemente puede agregar el pie de página html en la base de datos y cargarlo con PHP en cada página. Primero tendría que codificar el PHP en cada página, pero después de eso todo lo que necesita para cambiar el pie de página es solo una edición rápida de la base de datos. Busque MySQL/PHP.

+0

Almacenar HTML en la base de datos no es una buena idea. Una base de datos es para datos, no una vista HTML. Con el tiempo, esto puede crear un caos que es difícil de mantener debido a que sus diferentes preocupaciones no están separadas y compartimentadas. – ROFLwTIME