Создание программы: игра на canvas

Два урока на одну большую цель — свою игру на canvas.

📋 Заданий: 2✅ С автопроверкой: 1✨ Новых: 1

🕹️Задания

1

Игра «Арканоид»

сложнов VS Code

Создай игру, как на анимации: платформа управляется с клавиатуры, мячик отскакивает от стен, платформы и кирпичей.

Игра

🖥️ Это большое задание — делай его в VS Code на компьютере и открывай страницу в браузере. Не забудь выложить результат на свой сайт на GitHub!

Показать ответ (сначала попробуй сам!)
2

Управление с клавиатуры

средненовоеавтопроверка

Первый шаг к игре: квадрат #player должен двигаться стрелками. По нажатию → (event.key === 'ArrowRight') он сдвигается вправо на 20px, по ← — влево. Позицию храни в переменной x и меняй player.style.left.

Показать ответ (сначала попробуй сам!)
let player = document.querySelector('#player')
let x = 0

document.addEventListener('keydown', function (event) {
    if (event.key === 'ArrowRight') {
        x += 20
    } else if (event.key === 'ArrowLeft') {
        x -= 20
    }
    player.style.left = x + 'px'
})