每日一个js实例11--上下左右键

来源:互联网 发布:域名价值评估 编辑:程序博客网 时间:2024/05/02 02:29

<div id="box"></div>

<style>
            #box{width: 100px;height: 100px;position: absolute;background:pink;}
</style>


<script type="text/javascript">
            function $(id){return document.getElementById(id)};
            document.onkeydown=function(e){
                var e=e||event;
                var code=e.keyCode;
                switch(code){
                    case(37):
                        $("box").style.left=$("box").offsetLeft-10+'px';
                        break;
                    case(38):
                        $("box").style.top=$("box").offsetTop-10+'px';
                        break;
                    case(39):
                        $("box").style.left=$("box").offsetLeft+10+'px';
                        break;
                    case(40):
                        $("box").style.top=$("box").offsetTop+10+'px';
                        break;
                }    
            }
        </script>


0 0