JQuery-mobile, Phonegap, iOS, cabecera fija salta después de dejar la forma de input

Estoy usando Phonegap con JQuery-mobile, Phonegap en iOS. Encuentro este problema con el encabezado saltando al medio cuando salgo de la input de formulario.

Ya establezco data-hide-during-focus = "true" tanto en el encabezado fijo como en el pie de página. Este problema me está matando.

Solutions Collecting From Web of "JQuery-mobile, Phonegap, iOS, cabecera fija salta después de dejar la forma de input"

Si solo tenemos una barra de encabezado, podemos seguir el código solo para la barra de encabezado principal.

$(document).on('focus', 'select, input, textarea', function () { $('#main-headerbar').css({'position': 'absolute', 'top': '0px' }); }); $(document).on('blur', 'select, input, textarea', function () { $('#main-headerbar').css({ 'position': 'fixed' }); }); 

Si tenemos dos barras de encabezado y la barra de encabezado secundario se mostrará debajo de la barra de encabezado principal (si la barra de encabezado principal es '47px', establezca el estilo superior para la segunda barra de encabezado, arriba: 47px).

 $(document).on('focus', 'select, input, textarea', function () { $('#main-headerbar').css({'position': 'absolute', 'top': '0px' }); $('#Second-headerbar').css({ 'position': 'absolute', 'top' : '0px' }); }); $(document).on('blur', 'select, input, textarea', function () { $('#main-headerbar').css({ 'position': 'fixed' }); $('#Second-headerbar').css({ 'position': 'fixed', 'top': '47px' }); }); 

O siga la corrección de iOS para los elementos fijos de position en la input

Tuve el problema similar que estaba usando 1.0.1 y el principal problema que surgía en los saltos de encabezado era en la versión 2.3 más antigua de Android e incluso en el teléfono Google Nexus. He buscado en Internet más y más que después de un poco de I + D, me doy count de que básicamente fue un error de css. Debajo de lo que he hecho para solucionarlo

  1. Indique su class de encabezado ".header" de cada página
  2. Crea una class css con el siguiente código
  3. .header{ border: 0px; position: fixed; width: 100%; top: 0px; left: 0px; z-index: 21; }

Además, si se enfrenta a problemas en los que el encabezado salta después de cambiar la página, agregue este código $.mobile.silentScroll(0); en $("#yournextpageid").live("pageshow", function() { $.mobile.silentScroll(0); }

Lo que Jquery data-position="fixed" hace es que agrega dinámicamente la position superior a su encabezado y tiene sobrecarga y resulta ser muy pegajoso en algunos dispositivos. Además, salta en ciertos dispositivos al abrir el keyboard. Agregar más arriba CSS resolverá sus problemas.

en Config.xml, cambie la línea a false y solucionará su problema.