Как передвинуть блок по нажатию клавиши?

Question

[katunin_n]

Пытаюсь передвинуть квадрат по нажатию кнопки "Вправо". Но выдаёт ошибку:

Uncaught TypeError: Cannot read properties of undefined (reading 'left')
at HTMLDocument. (script.js:15:32)
(anonymous) @ script.js:15

<span class="circle"></span>

body {
   margin: 0px;
   padding: 0px;
}
.circle {
   display: inline-block;
   width: 100px;
   height: 100px;
   border-radius: 50%;
   background-color: black;
   left: 0;
   margin: 0px;
}

let circle = document.getElementsByClassName('circle');

document.addEventListener('keydown', function (event) {
   if (event.code == 'ArrowRight') {
      console.log(circle.style.left);
   }
});

Comments

[Kentavr16]

Если плпробовать изменить 0 на 0рх?

Answer 1

[imko]

Ты у коллекции элементов пытаешься получить свойство одного элемента. Преобразуй ее в массив и перебором каждый обработай

Answer 2

[Elvis]

Думаю поможет https://stackoverflow.com/questions/5597060/detect...

Comments

[katunin_n]

Там немного другое, у меня при нажатии не получается подвинуть.
Я пытаюсь двигать через top/left и мне пишет что такое значение не найдено.

[Kentavr16]

И изменить position на relative \ absolute