돌아가기
이 글은 다음 언어로만 작성되어 있습니다. English, 日本語, Русский, 简体中文. 한국어 번역에 참여해주세요.

Keyboard-driven mouse

중요도: 4

Focus on the mouse. Then use arrow keys to move it:

새 창에서 데모 보기

P.S. Don’t put event handlers anywhere except the #mouse element. P.P.S. Don’t modify HTML/CSS, the approach should be generic and work with any element.

샌드박스를 열어 정답을 작성해보세요.

We can use mouse.onclick to handle the click and make the mouse “moveable” with position:fixed, then mouse.onkeydown to handle arrow keys.

The only pitfall is that keydown only triggers on elements with focus. So we need to add tabindex to the element. As we’re forbidden to change HTML, we can use mouse.tabIndex property for that.

P.S. We also can replace mouse.onclick with mouse.onfocus.

샌드박스를 열어 정답을 확인해보세요.