1

In my phonegap application I have a page that contains form elements. The problem is that when I navigate from home page to this page (form page) a white screen appears and then the form page appears. This screen occurs only once, when I open the form page after launching the app. This problem happens only for the form page, since the other pages in the application are showed directly.

I have set all transitions to none in my app, and tried to use fastclick, but nothing worked for me! How can I solve this problem?

Any help would be greatly appreciated.

Home page .js

  document.addEventListener('deviceready', onDeviceReady, false);



 function   onDeviceReady () 
{

     setTimeout(function(){ navigator.splashscreen.hide();} ,3000);



     $('#GoToForm_BTN').on('click', function(){ 

    $(this).attr('href','formPage.html'); 


  } );

I have used this code in my css file but the problem remains

.ui-page {
  -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
   overflow: hidden;
 }

a, input, button {
  -ms-touch-action: none !important;
 }

 *{
    -webkit-transform: translateZ(0);
    -webkit-transform:translate3d(0,0,0);
  }
user
  • 621
  • 15
  • 46

1 Answers1

0

Without seeing any code it is difficult to locate the exact problem, if indeed there is a one. I believe that the problem can be located at the loading time of your application. If it is a multipage application (one html file), and depending on the size of the DOM tree created, it is natural that you are seeing this white screen. The DOM hasn't been fully loaded so you see a blank screen. The best thing you can do is to show a loading image when your application launches, and remove it when the page is ready.

Alkis Kalogeris
  • 17,044
  • 15
  • 59
  • 113
  • @alkisThanks for helping me , my app is single page template(multiHtml files ) I am using a splash screen when the app launches and i hide it once the home page is loaded to the DOM , I didn't post my code since I have tried to remove all the java script code relates to the form page then i tested the app but the white screen still appears before showing the form page , do you think that the html code of the form page is causing this problem ? – user Dec 28 '13 at 09:13
  • I don't think it does, no. You could try showing some other page after the splash screen, that doesn't have the problem, just to see if the problem remains. You will have to post some code though. – Alkis Kalogeris Dec 28 '13 at 13:39
  • @alkisI show the home page after the splash screen I updated my code above – user Dec 28 '13 at 14:15
  • @alkisThe java script code for the form page is about validating the form fields and I have tested the form page without any java script code but the white screen still appear before showing the form page .so the java script code didn't cause this problem . can you help me more please – user Dec 28 '13 at 15:04
  • What version of jqm are you using? – Alkis Kalogeris Dec 28 '13 at 16:02
  • http://stackoverflow.com/questions/17962378/white-page-when-loading-while-using-jquery-mobile – Alkis Kalogeris Dec 28 '13 at 16:22