Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Preventing iOS Keyboard from scrolling page in cordova 3.5

I am using Cordova 3.5 and jQuery mobile to build an iOS app. I have disabled scrolling in most of the app; however, when I select an input field, the iOS keyboard opens and scrolls the page up. I do not want this functionality. Since the input is high enough that the keyboard would not cover it up, I want the page to remain still while the keyboard covers up the bottom part of the page.

This question is similar to a number of others like this one, and is the opposite of the problem posted here.

However, none of the posted answers worked for me, so I will post my solution here.

like image 256
user3558515 Avatar asked Jul 21 '14 13:07

user3558515


2 Answers

After a lot of research I found a really simple answer and none of the others worked.

In your css do:

html {
  touch-action: none;
}
body {
  touch-action: all;
}
like image 150
Kevin Avatar answered Oct 02 '22 15:10

Kevin


From my experience, and saying this as a developer who avoids 3rd party plugins as much as possible, I've found that virtual keyboard issues in Cordova are best solved with a plugin.

The Cordova plugin directory has several keyboard plugins (http://cordova.apache.org/plugins/?q=keyboard)

I recommend the following plugin:
https://github.com/cjpearson/cordova-plugin-keyboard

Which provides the following command to disable scrolling when the virtual keyboard is open.

cordova.plugins.Keyboard.disableScrollingInShrinkView(true);
like image 30
tim-montague Avatar answered Oct 02 '22 14:10

tim-montague