Mottie / Keyboard

Virtual Keyboard using jQuery ~
http://mottie.github.io/Keyboard/
Other
1.78k stars 723 forks source link

Zoom Problem #484

Closed bliet closed 8 years ago

bliet commented 8 years ago

The normal behavior of IE11 and Edge is to Zoom in by a Double Tap. That is a problem because you cannot type fast on the OSK. Is there a way to solve this issue?

Mottie commented 8 years ago

Hi @bliet!

I haven't tried this, but I read here that you'll need to create a css file with the following:

body {
  -ms-touch-action: manipulation !important;
}

Then add that file as a user style sheet in Tools → Internet Options → Accessibility.

I haven't tried adding the css to the page or directly to the keyboard container yet, but I'm in a hurry this morning.

bliet commented 8 years ago

I cannot use a solutions, which the user have to change in his internet options.

I tried this in my code:

.ui-keyboard div {
  -ms-touch-action: manipulation !important;
}

and this:

body {
  -ms-touch-action: manipulation !important;
}

It doesn't work. I am using hammer.js on other objects. There the double tab doesn't fire a zoom. Mybe i will combine hammer.js with the OSK tomorrow.

Mottie commented 8 years ago

Hmm, so I read somewhere else that IE10 and IE11 are different LOL

And please try targeting the keyboard elements, not the divs inside:

.ui-keyboard {
    -ms-touch-action: manipulation; /* IE10  */
    touch-action: manipulation;     /* IE11+ */
}

Also, try adding a meta tag to disable zooming:

<meta name="viewport" content="width=device-width, user-scalable=no">

Either way, I will likely add options to allow setting your own keybinding as I think the best method would be to use PEP.

bliet commented 8 years ago

I use a viewport already. But I don't want to disable the scale for the hole site, only for the keyboards.

I will try the "touch-action" tomorrow. Many thanks. (UPDATE: It works.)

Mottie commented 8 years ago

Oh great!, I'll add those definitions to the keyboard container then.