Limited availability
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.
The VirtualKeyboard
interface of the VirtualKeyboard API is useful on devices that have on-screen virtual keyboards, such as tablets, mobile phones, or other devices where a hardware keyboard may not be available.
The VirtualKeyboard
interface makes it possible to opt out of the automatic way browsers handle on-screen virtual keyboards by reducing the height of the viewport to make room for the virtual keyboard. You can prevent the browser from changing the size of the viewport, detect the position and size of the virtual keyboard â adapting the layout of your web page as a follow-up â and programmatically show or hide the virtual keyboard.
You access the VirtualKeyboard
interface by using navigator.virtualKeyboard
.
The VirtualKeyboard
interface inherits properties from its parent, EventTarget
.
VirtualKeyboard.boundingRect
Read only Experimental
A DOMRect
that describes the geometry of the virtual keyboard.
VirtualKeyboard.overlaysContent
Experimental
A Boolean
that defines whether the browser should stop handling the on-screen virtual keyboard.
The VirtualKeyboard
interface inherits methods from its parent, EventTarget
.
VirtualKeyboard.show()
Experimental
Show the virtual keyboard.
VirtualKeyboard.hide()
Experimental
Hide the virtual keyboard.
geometrychange
Experimental
Fires when the geometry of the on-screen virtual keyboard changes, which happens when the virtual keyboard appears or disappears.
The following example demonstrates how to opt out of the automatic virtual keyboard behavior, and detect the geometry of the virtual keyboard in the web page:
if ("virtualKeyboard" in navigator) {
navigator.virtualKeyboard.overlaysContent = true;
navigator.virtualKeyboard.addEventListener("geometrychange", (event) => {
const { x, y, width, height } = event.target.boundingRect;
});
}
Specifications Browser compatibility See also
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4