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.
The button values in the following example are stored as an array of GamepadButton
objects. This simple example checks to see if the GamepadButton.value
of a button is greater than 0
, or if the GamepadButton.pressed
property indicates the button has been pressed.
function gameLoop() {
const gp = navigator.getGamepads()[0];
if (gp.buttons[0].value > 0 || gp.buttons[0].pressed) {
b--;
} else if (gp.buttons[1].value > 0 || gp.buttons[1].pressed) {
a++;
} else if (gp.buttons[2].value > 0 || gp.buttons[2].pressed) {
b++;
} else if (gp.buttons[3].value > 0 || gp.buttons[3].pressed) {
a--;
}
ball.style.left = `${a * 2}px`;
ball.style.top = `${b * 2}px`;
requestAnimationFrame(gameLoop);
}