вернуться к уроку

Мышь, управляемая клавиатурой

важность: 4

Установите фокус на мышь. Затем используйте клавиши со стрелками, чтобы её двигать:

Демо в новом окне

P.S. Не добавляйте обработчики никуда, кроме элемента #mouse. P.P.S. Не изменяйте HTML/CSS, подход должен быть общим и работать с любым элементом.

Открыть песочницу для задачи.

Мы можем использовать mouse.onclick для обработки клика и сделать мышь «перемещаемой» с помощью position:fixed, а затем использовать mouse.onkeydown для обработки клавиш со стрелками.

Единственная проблема в том, что keydown срабатывает только на элементах с фокусом. И нам нужно добавить tabindex к элементу. Так как изменять HTML запрещено, то для этого мы можем использовать свойство mouse.tabIndex.

P.S. Мы также можем заменить mouse.onclick на mouse.onfocus.

Открыть решение в песочнице.