Android Browser textarea scrolls all over the place, is unusable

Question

So I\'ve built a nice, shiny HTML5 application that is targeted at mobile Safari, and Android\'s default browser. The Android versions I\'m testing it on are 2.1 and 2.2.

Answer 1

There is no magic answer. Android keyboard input interactions with web forms is simply horrendous. You have to thread the needle very carefully to make it work properly, and keyboard behavior is not the same across Android versions. But it is possible with a LOT of work (see our Sencha Touch framework for what's possible today - the other mobile web frameworks are tackling the exact same problems too).

Answer 2

I experience this behavior on nearly every page. Here on StackOverflow, on a wordpress blog and many more.

I can only image that this is a usability bug/issue in the android browser and this is why I prefer native UI/application :)

Answer 3

If at all possible, you can lockdown the scrolling of the screen while the user is typing by setting the overflow property of body to 'hidden' - you can selectively enable/disable it on focus/blur events. Of course this does mean that your user will not be able to scroll while typing

Answer 4

SOLUTION: The 3D webkit is broken in Android, this is causing this problem. Make sure you are not using -webkit-transform: translate3d(0, 0, 0); or -webkit-backface-visibility: hidden; on anything related to the inputs. :(