键盘方向键移动某个元素

1.效果图

2.实现原理

页面监听按键事件，在方向键按下的时候，移动选中的元素。

 //快捷键控制移动
    $(document).keydown(function (event) {
        var keyNum = event.which
        var item = $('#' + curRectangle)
       //animate有这个功能，-=2 表示原来的值-2在赋给该属性。
        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;
            }
        }