2012-03-15 22 views
6

Estoy usando jQueryMobile 1.1-rc1 y mi indicador de carga de página no se muestra correctamente.jQueryMobile y Themeroller: ¿necesita volver a lanzar temas al actualizar jQueryMobile?

Originalmente hice mi tema cuando salió Themeroller por primera vez, y todo ha ido bien a través de las últimas actualizaciones de jQM hasta la más reciente.

Ahora el icono de carga no gira y ya no está centrado en la burbuja.

¿Necesita volver a enrollar los temas en el dispositivo cuando actualice? No veo la opción de seleccionar la versión de destino en themeroller.

Respuesta

1

Eché otro vistazo a esto y la respuesta es que ThemeRoller para jQueryMobile solo es compatible con la versión 1.0.x de jQM.

Todd Parker Answered the question here en el rastreador de problemas jQueryMobile.

Tyler Benzinger Answered the question aquí en el rastreador de problemas de Theme Roller.

Parece que tendremos que esperar a que Theme Roller admita los temas de la versión 1.1.

Actualización: Solución

En su comentario theme.css a cabo o eliminar la sección .ui-icono de carga e inserte el siguiente (de la CSS 1.1-RC1)

/* loading screen */ 
.ui-loading .ui-loader { display: block; } 
.ui-loader { display: none; z-index: 9999999; position: fixed; top: 50%; box-shadow: 0 1px 1px -1px #fff; left: 50%; border:0; } 
.ui-loader-default { background: none; opacity: .18; width: 46px; height: 46px; margin-left: -23px; margin-top: -23px; } 
.ui-loader-verbose { width: 200px; opacity: .88; height: auto; margin-left: -110px; margin-top: -43px; padding: 10px; } 
.ui-loader-default h1 { font-size: 0; width: 0; height: 0; overflow: hidden; } 
.ui-loader-verbose h1 { font-size: 16px; margin: 0; text-align: center; } 
.ui-loader .ui-icon { background-color: #000; display: block; margin: 0; width: 44px; height: 44px; padding: 1px; -webkit-border-radius: 36px; -moz-border-radiu$ 
.ui-loader-verbose .ui-icon { margin: 0 auto 10px; opacity: .75; } 
.ui-loader-textonly { padding: 15px; margin-left: -115px; } 
.ui-loader-textonly .ui-icon { display: none; } 
.ui-loader-fakefix { position: absolute; } 

/* loading icon */ 
.ui-icon-loading { 
    background: url(images/ajax-loader.gif); 
    background-size: 46px 46px; 
} 

Hacer Asegúrese de tener el nuevo archivo ajax-loader.gif en la carpeta de imágenes del tema.

1

Me di cuenta de que el nombre del archivo anterior era ajax-loader.png. Creo que ahora es ajax-loader.gif, por lo que es posible que desee comprobarlo.

1

Las últimas actualizaciones del marco han cambiado mucho el CSS, y eso continuará para la versión 1.1. Cuando cambie a una versión más nueva del archivo JS, también deberá volver a empaquetar su tema en Themeroller.

En la última actualización, cambiaron bastante el marco de CSS para encabezados fijos/pies de página, transiciones y algunas otras cosas (como el mensaje de carga ha sido renovado). La última actualización también dio al mensaje de carga más opciones, por lo que la estructura del HTML probablemente cambió y el CSS anterior no es del todo correcto en comparación con el nuevo JS.

Para probar esto, puede vincular a una versión actual estándar de CSS y ver si el mensaje de carga aparece correctamente.

+0

Encontré este informe de error que parece relacionado https://github.com/jquery/jquery-mobile/issues/3822 –

+0

y violín relacionado http://jsfiddle.net/evgenyneu/ccxq3/8/ –

Cuestiones relacionadas