• sample-01.html
  • This page mimics the structure of a jQM page with a listview on each page. The lists are completely unstyled. Transition is pretty smooth on Android 2.1.
• sample-02.html
  • This page is the same as the previous example, except that it sets the height of the content area of page 2 to 2100px. Sometimes, there is a noticeable brief flicker of page-2 before the transition starts.
• sample-03.html
  • This page builds on the sample above, and mimics the position:relative and display:block styles used in a listview. The results in terms of transitions are the same as the previous sample.
• sample-04.html
  • This page builds on the sample above, adding padding and visuals for ui-btn-up-c including text shadows and gradients. Transitions are still relatively smooth here.
• sample-05.html
  • Adding whitespace:nowrap and text-overflow:ellipsis. Still relatively smooth.
• sample-06.html
  • A version of the sample that uses jQuery Mobile to enhance the markup.
• sample-07.html
  • Same as sample-05.html but with the viewport CSS added to the body element.
• sample-08.html
  • Static markup snapshot of sample-06.html.
• sample-09.html
  • Same markup as sample-08.html but slowly introducing the jQM CSS in an attempt to find the rules that start to cause flashing! This version just uses viewport structure and transitions CSS. No flashing here.
• sample-10.html
  • Building on previous sample. This one adds the entire c-theme. Slight flicker on start of transition, but there is no flash of previous page when transition is complete.
• sample-11.html
  • Building on previous sample. This one adds the listview CSS.
• sample-12.html
  • Building on previous sample. This adds the structure CSS for headers/footers and content. This shows the previous page flashing problem!!!
• sample-13.html
  • Same as sample-12.html except that the overflow-x:hidden property in the .ui-content rule is commented out. This actually stops the flashing of the previous page!
• sample-14.html
  • Same as sample-13.html, but this time the entire jQM CSS is added. With the one overflow-x:hidden tweak from sample-13.html. ARRGGGH! It still blinks, there must be something else in the larger CSS that is causing a problem.
• sample-15.html
  • Same as sample-14.html with the viewport overflow-x:hidden commented out. Still blinks!
• sample-16.html
  • Restting things. Going back to sample-13.html and incrementatlly adding more jQuery Mobile CSS. This version adds the CSS for the 5 theme swatches. sample-13.html only had one theme 'c'. Surprisingly, this causes the previous page flashing to occur!
• sample-17.html
  • Interesting, removing themes 'd' and 'e' stop the flashing even though they are not used at all within the markup. This is making me think that the page complexity (reflow) as well as the number of rules is slowing things down enough to see flashing.
• sample-18.html
  • Re-introduce swatches 'd' and 'e' but with blank rules to see if it's just the number of rules that cause the problem.