1. Rendering
2. Implementation principle
The page listens for key events and moves the selected element when the arrow keys are pressed.
//Shortcut keys to control movement $(document).keydown(function (event) { var keyNum = event.which var item = $('#' + curRectangle) //animate has this function, -=2 means that the original value -2 is assigned to this property. switch (keyNum) { case 37: item.animate({left:'-=2'},0) break; case 38: item.animate({top:'-=2'},0) break; case 39: item.animate({left:'+=2'},0) break; case 40: item.animate({top:'+=2'},0) break; default: { break; } }