-1

My web app uses two javascript frameworks: iscrol and jqmobi. But when the app loads a large piece of content into the html page, the screen flickers in iOS6. I'm confused that what causes this problem and if it is related with the above two js frameworks, which one should take the major responsibility? Is there any solution can make the flickers never occurs?

Shadow
  • 89
  • 4

2 Answers2

0

The default kitchen sink sample does not flicker using jqmobi's built in scrolling library. Signs point to iScroll causing the problem.

john
  • 26
  • 1
  • Thank you. I find that when my html page contains lots of which make the page very long, the problem occurs. But I still cannot figure out the reason and solution. – Shadow Mar 25 '13 at 03:10
0

Check out this article from iScroll http://cubiq.org/you-shall-not-flicker. I had the same problems when I used it and found applying -webkit-transform:translate3d(0,0,0) to the elements that were scrollable solved the flickering for me. Use this sparingly though as it does have an effect on performance.

#someDiv {
-webkit-transform:translate3d(0,0,0);
}

Hope this helps!

woolm110
  • 1,194
  • 17
  • 27
  • Thanks. But iscroll will change the "-webkit-transform" property to "translate(xx,xx) translateZ(0)" while scrolling. – Shadow Mar 26 '13 at 06:42
  • Which browser are you testing it? Chrome and Safari will support it as they're both webkit browsers, firefox is different.. – woolm110 Mar 26 '13 at 09:30