The Gamepad.axes
property of the Gamepad
interface returns an array representing the controls with axes present on the device (e.g. analog thumb sticks).
Each entry in the array is a floating point value in the range -1.0 – 1.0, representing the axis position from the lowest value (-1.0) to the highest value (1.0).
Value
Examples
function gameLoop() {
const [gp] = navigator.getGamepads();
let a = 0;
let b = 0;
if (gp.axes[0] !== 0) {
b -= gp.axes[0];
} else if (gp.axes[1] !== 0) {
a += gp.axes[1];
} else if (gp.axes[2] !== 0) {
b += gp.axes[2];
} else if (gp.axes[3] !== 0) {
a -= gp.axes[3];
}
ball.style.left = `${a * 2}px`;
ball.style.top = `${b * 2}px`;
const start = requestAnimationFrame(gameLoop);
}
Specifications
Browser compatibility
|
Desktop |
Mobile |
|
Chrome |
Edge |
Firefox |
Internet Explorer |
Opera |
Safari |
WebView Android |
Chrome Android |
Firefox for Android |
Opera Android |
Safari on IOS |
Samsung Internet |
axes |
21 |
12 |
29 |
No |
15 |
10.1 |
4.4 |
25 |
32 |
14 |
10.3 |
1.5 |
See also