Hi, everybody.
In my game implemented control of the arrow keys.
The problem: browser scrolls the page using the same keyboard arrows.
How can I avoid this?
(already a heap of variants tried)
Answer myself, maybe someone will be useful. (please correct me if you know a better option)
Intercept pressing. Repeal the distribution. Create your event tied to the buttons “W,S,A,D”.
window.onkeydown = function (e) {
switch (e.key) {
case 'ArrowUp': {
const event = new KeyboardEvent("keydown", {
bubbles: true,
cancelable: true,
code: "KeyW"
});
document.getElementById('gameBody').dispatchEvent(event);
e.preventDefault();
}break;
case 'ArrowDown': {
const event = new KeyboardEvent("keydown", {
bubbles: true,
cancelable: true,
code: "KeyS"
});
document.getElementById('gameBody').dispatchEvent(event);
e.preventDefault();
}break;
case 'ArrowLeft': {
const event = new KeyboardEvent("keydown", {
bubbles: true,
cancelable: true,
code: "KeyA"
});
document.getElementById('gameBody').dispatchEvent(event);
e.preventDefault();
}break;
case 'ArrowRight': {
const event = new KeyboardEvent("keydown", {
bubbles: true,
cancelable: true,
code: "KeyD"
});
document.getElementById('gameBody').dispatchEvent(event);
e.preventDefault();
}break;
}
}
P.S. Apologize. My English is still weak.