I am developing an application that is going to be used on Microsoft surface tablets (mostly) and I am having an issue with the virtual keyboard. Currently, when the user touches an input field the keyboard opens up and practically covers more than 50% of the screen leaving all other contents of the site covered by the keyboard. I am trying to find a way to make it responsive (I am using bootstrap) as to make the site move accordingly when the keyboard is selected. Another user posted a similar question but had no replies except for one that stated that it might be a duplicate based on mobile devices (which is different considering that it is to be used on a tablet that resembles a laptop more than a mobile device)
The question was originally asked here : Detect MS Surface Virtual Keyboard in Javascript
Are there any ways of going around this? been searching for a while to no avail. I have tried to use something such as :
var ieX;
if (Object.hasOwnProperty.call(window, "ActiveXObject") && !window.ActiveXObject) {
// is IE11
console.log("Internet Explorer detected");
ieX = true;
if (ieX) {
document.write('<meta name="viewport" content="width=device-width,height='+window.innerHeight+', initial-scale=1.0">');
}
}
which is basically pointless considering that a) I am already using bootstrap and b) even if I add the meta tag to the main template file it continues to be pointless due to bootstrap's built in responsiveness.
Any pointers would be greatly appreciated.
Edit for clarification: Yes, the code that finds out the user agent is for IE 11 because we are a godless company and that is what I am being forced to test the code for at the moment.
Edit for duplicate mark: Microsoft Surface deals with keyboards in a way which is different to that of Android and IOS, thus making the solutions in the duplicate link(which was already originally included by me with an explanation...) as not valid.
