2022/1/15，练习

最新推荐文章于 2024-08-16 19:02:09 发布

weixin_44645655

最新推荐文章于 2024-08-16 19:02:09 发布

阅读量115

点赞数

分类专栏： javascript 文章标签： javascript 前端 css3

本文链接：https://blog.csdn.net/weixin_44645655/article/details/122510026

版权

javascript 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>练习</title>
    <script type="text/javascript">
        window.onload = function () {

            //为document绑定一个键盘按下事件
            document.onkeydown = function (event) {
                event = event || window.event;
                //console.log(event.keyCode);

                switch (event.keyCode) {
                    case 37:
                        //向左
                        box1.style.left = box1.offsetLeft - 10 + "px";
                        break;
                    case 39:
                        box1.style.left = box1.offsetLeft + 10 + "px";
                        break;
                    case 38:
                        box1.style.top = box1.offsetTop - 10 + "px";
                        break;
                    case 40:
                        box1.style.top = box1.offsetTop + 10 + "px";
                        break;

                }

            };
        };
    </script>
</head>

<body>
    <div id="box1" style="width: 100px;height: 100px;background-color: red; position: relative;"></div>
</body>

</html>

weixin_44645655

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2022/1/15，练习

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>练习
复制链接

扫一扫