Web/API/GamepadButton

The GamepadButton interface defines an individual button of a gamepad or other controller, allowing access to the current state of different types of buttons available on the control device.

A GamepadButton object is returned by querying any value of the array returned by the buttons property of the Gamepad interface.

Note: This is the case in Firefox Gecko 28 and later; Chrome and earlier Firefox versions still return an array of double values when this property is accessed.

Properties

GamepadButton.value Read only: A double value used to represent the current state of analog buttons, such as the triggers on many modern gamepads. The values are normalized to the range 0.0 —1.0, with 0.0 representing a button that is not pressed, and 1.0 representing a button that is fully pressed.
GamepadButton.pressed Read only: A Boolean value indicating whether the button is currently pressed (true) or unpressed (false).

Example

The following code is taken from my Gamepad API button demo (you can view the demo live, and find the source code on Github.) Note the code fork — in Chrome Navigator.getGamepads needs a webkit prefix and the button values are stored as an array of double values, whereas in Firefox Navigator.getGamepads doesn't need a prefix, and the button values are stored as an array of GamepadButton objects; it is the GamepadButton.value or GamepadButton.pressed properties of these we need to access, depending on what type of buttons they are. In this simple example I've just allowed either.

function gameLoop() {
  if(navigator.webkitGetGamepads) {
    var gp = navigator.webkitGetGamepads()[0];

    if(gp.buttons[0] == 1) {
      b--;
    } else if(gp.buttons[1] == 1) {
      a++;
    } else if(gp.buttons[2] == 1) {
      b++;
    } else if(gp.buttons[3] == 1) {
      a--;
    }
  } else {
    var gp = navigator.getGamepads()[0];

    if(gp.buttons[0].value > 0 || gp.buttons[0].pressed == true) {
      b--;
    } else if(gp.buttons[1].value > 0 || gp.buttons[1].pressed == true) {
      a++;
    } else if(gp.buttons[2].value > 0 || gp.buttons[2].pressed == true) {
      b++;
    } else if(gp.buttons[3].value > 0 || gp.buttons[3].pressed == true) {
      a--;
    }
  }

  ball.style.left = a*2 + "px";
  ball.style.top = b*2 + "px";

  var start = rAF(gameLoop);
};

Specifications

Specification	Status	Comment
GamepadThe definition of 'GamepadButton' in that specification.	Working Draft	Initial definition

Browser compatibility

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`GamepadButton`	Chrome Full support 35 Full support 35 No support 21 — 34 Prefixed' Prefixed' Implemented with the vendor prefix: webkit	Edge Full support 12	Firefox Full support 29 Full support 29 No support 24 — 28 Disabled' Disabled' From version 24 until version 28 (exclusive): this feature is behind the `dom.gamepad.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE No support No	Opera Full support 22 Full support 22 No support 15 — 21 Prefixed' Prefixed' Implemented with the vendor prefix: webkit	Safari Full support 10.1	WebView Android No support No	Chrome Android Full support Yes	Firefox Android Full support 32	Opera Android Full support 22 Full support 22 No support 14 — 21 Prefixed' Prefixed' Implemented with the vendor prefix: webkit	Safari iOS Full support 10.3	Samsung Internet Android Full support Yes
`pressed`	Chrome Full support 35 Full support 35 No support 21 — 34 Prefixed' Prefixed' Implemented with the vendor prefix: webkit	Edge Full support 12	Firefox Full support 29 Full support 29 No support 24 — 28 Disabled' Disabled' From version 24 until version 28 (exclusive): this feature is behind the `dom.gamepad.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE No support No	Opera Full support 22 Full support 22 No support 15 — 21 Prefixed' Prefixed' Implemented with the vendor prefix: webkit	Safari Full support 10.1	WebView Android No support No	Chrome Android Full support Yes	Firefox Android Full support 32	Opera Android Full support 22 Full support 22 No support 14 — 21 Prefixed' Prefixed' Implemented with the vendor prefix: webkit	Safari iOS Full support 10.3	Samsung Internet Android Full support Yes
`touched`	Chrome Full support Yes	Edge Full support 15	Firefox Full support Yes	IE No support No	Opera ?	Safari Full support 10.1	WebView Android No support No	Chrome Android Full support Yes	Firefox Android Full support Yes	Opera Android No support No	Safari iOS Full support 10.3	Samsung Internet Android Full support Yes
`value`	Chrome Full support 35 Full support 35 No support 21 — 34 Prefixed' Prefixed' Implemented with the vendor prefix: webkit	Edge Full support 12	Firefox Full support 29 Full support 29 No support 24 — 28 Disabled' Disabled' From version 24 until version 28 (exclusive): this feature is behind the `dom.gamepad.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE No support No	Opera Full support 22 Full support 22 No support 15 — 21 Prefixed' Prefixed' Implemented with the vendor prefix: webkit	Safari Full support 10.1	WebView Android No support No	Chrome Android Full support Yes	Firefox Android Full support 32	Opera Android Full support 22 Full support 22 No support 14 — 21 Prefixed' Prefixed' Implemented with the vendor prefix: webkit	Safari iOS Full support 10.3	Samsung Internet Android Full support Yes

Legend

Full support: Full support
No support: No support
Compatibility unknown: Compatibility unknown
User must explicitly enable this feature.': User must explicitly enable this feature.
Requires a vendor prefix or different name for use.': Requires a vendor prefix or different name for use.