iphone - White page when loading while using jQuery Mobile -


we're using jquery mobile 1.3.2 mobile html5 app @ www.tekiki.com. (check iphone, or check www.tekiki.com/dandy/dandy desktop.)

upon loading, jqm shows white page between loading screen , first page of app. there settings in jqm repress loading screen? closest found $.mobile.loading(), pertains loading text. want whole white screen vanish, meaning app should go directly loading screen first page.

the white screen talking results class declared in jqm css:

/*fouc*/ .ui-mobile-rendering > * { visibility: hidden; } 

the class added when jqm begins initalize

// add mobile, initial load "rendering" classes docel $html.addclass( "ui-mobile ui-mobile-rendering" ); 

and removed on first pageshow.

the whole procedure necessary, because otherwise see pre-enhanced markup until jqm done rendering it. if want "remove" it, declare:

 .ui-mobile-rendering > * { visibility: visible; } 

but see source code being touched jquery mobile.

workarounds know:

supply pre-enhanced markup instead of jqm doing it
kind of ordeal before jqm 1.4 (where have fewer generated elements , option tell jqm, widgets being provided pre-enhanced), can done nevertheless albeit requiring widget rewriting.

also see in code, problem should be, ios startup image disappears when wants (= before jqm initialized) vs. having control on , hiding when jqm done.

so: use other means of coverup custom startup screen
example, i'm doing this or this. both applications loaded requirejs , use custom startup script wrote (after pulling hair out ios startup images).

here how works:

  • add class of splash body. css:before full white background (...loading)
  • add optional background image via css or javascript (no jquery or jqm, because must run before either parsed)
  • remove splash on pageshow body. stay on page loaded first (unless use rel="external", body persists, can safely add class pages , run coverup on first page user loads.

this hides whatever startup screen set when jqm done, not have white screen. plus works cross-browser (vs ios startup image) , can used different image sizes (try 2nd application different devices & portait/landscape).

if want full code sample, let me know.


Comments

Popular posts from this blog

basic authentication with http post params android -

vb.net - Virtual Keyboard commands -

css - Firefox for ubuntu renders wrong colors -