How to remove white flash between html page switch using phonegap

Question

I am using phonegap to develop an app. I am not using any frameworks like jQuery mobile or anything of that sort. Just HTML, JavaScript and CSS. Each page within the app has its own html file.

The problem I have is that when I click on a link to go from one page to the next page there is this small short white flash. I guess the DOM has to be loaded from scratch so thats why it goes to white for a moment until elements start to be loaded into the DOM.

The strange thing is that on some pages (the ones that have almost no javascript) the flash is so short that its unnoticable on iOS devices (on android all pages have noticeable white transition when going to a new page).

Is there any way to remove that white "flash" between page switching/transitions? It makes the app look laggy and very glitchy and I must solve it before I can deliver this app.

Answer 1

Add this to the css elements your transitioning:

 -webkit-transform:translate3d(0,0,0);
  transform:translate3d(0,0,0);