Handle virtual keyboard on Windows 8 tablet

Question

In my webpage I have a text input field which gets covered by the keyboard in Windows 8.1 tablet.

I want the tablet to 'push up' the web page content (as it works on the iPad).

So: Is it possible to make the keyboard NOT covering my input field? And can I detect if a virtual keyboard is active with javascript?

Answer 1

You could get the relative position of the text field in comparison to the screen resolution and if the field lays on the 2nd vertical half (i.e. the space that covers the keyboard after appearing), scroll down the webpage for a fixed amount of pixels.

If you use jQuery, you could use the jquery.scrollTo plugin to scroll to the field with a vertical negative offset, so the field is always visible.

Plugin site: https://github.com/flesler/jquery.scrollTo

Hope this helps!

I have no Windows tablet to be sure of how the OS manages the keyboard pop-up, but this method has worked for me on Android and iOS.