05-08-2012 11:25 AM - edited 05-08-2012 11:26 AM
I am working on a WebWorks app (&still learning) for the PlayBook, which contains text input elements. These are not form inputs, but html5 content-editable elements.
Also, I have set the following code in the app's <head>, to disable users from being able to pinch to zoom within the app:
<meta name="viewport" id="viewport" content="width=device-width,height=device-height,i
Here's the problem. Whenever I tap on a user input field and the keyboard automatically pops up, I get the following issues:
1. Some <div> elements are slightly moved up the screen and slightly resized. I believe this might be my fault, as I am still learning as I previously mentioned. However, if anyone knows how to fix this I would really appreciate it. I've made those bugged <div> elements contain the "position" css property set to "fixed", but with no result.
2. Even though I've used that line of code in the header to prevent the app's outer scrolling/zooming, as long as the keyboard is up, that line of code no longer seems to work. This wouldn't necessarily be a problem. However, in this case, after editing a text input field the user is supposed to click on certain <div> elements (custom buttons), and if he accidentally performs a very slight pan instead of a tap gesture on those buttons, the entire app screen moves, as it becomes temporarily draggable.
I have also tested this second issue in the webGL demo of the open source "Tunnel Tilt" game: swiping diagonally up from the bottom left corner of the PlayBook's screen brought up the keyboard, and the entire app's screen immediately became draggable/pinch-to-zoomable, etc. Of course, this is not exactly an issue in this demo game.
I've been searching for solutions for each of these issues through forums, if there already is a solution found to any of them and I haven't found it, please reply, thank you.
05-09-2012 08:19 AM
From my converstions with the Browser team, this is by design. When the keyboard shows, it moves all the content above it so that you can see what you are typing.
10-03-2012 08:39 AM
On iOS (using my HTML5 application), I initially had the same "bump up" experience. On iOS, however, there is an option telling the keyboard not to push up the screen. Is there any similar option on BlackBerry (I am developing for PlayBook).