Screen Scrolls while typing Using JQTouch in an Android PhoneGap app?

Question

I have made an app using JQtouch, Jquery, and PhoneGap. When you type in a form's field, the entire page scrolls up or down each time you enter a character. I have searched everywhere for solutions but cannot find one. There was a similar problem here: https://github.com/jquery/jquery-mobile/issues/638 but his solution did not solve my issue.

Does anyone have an idea why the page would scroll up and down with each added character in a textbox? Because the page is so small, it scrolls up and down quickly making it very annoying.

Answer 1

Put the following CSS in your file after all other CSS styles:

    body {
        -webkit-perspective: none;
        -webkit-transform-style: flat;
    }
    body > * {
        -webkit-backface-visibility: visible;
        -webkit-transform: none;
    }

This should solve your problem (at least it did for me).