Question

我正在做一个简单的俄罗斯方块游戏。到目前为止，我有一个俄罗斯方块片，当单击空格键时会旋转。

我的下一步是使用箭头键左右移动对象。通过查看其他Stack Questions，我发现通过更改边距可以实现这一点。

        var angle = 0;
        var obj = document.getElementById('image')

        document.onkeydown = checkKey;

        function checkKey(e) {

            e = e || window.event;

            if (e.keyCode == '32') {
                rotate();
            }
            else if (e.keyCode == '37') {
                moveLeft();
            }
            else if (e.keyCode == '39') {
                moveRight();
            }

        }
        function rotate() {
            angle = angle + 90;
            console.log(angle)
            obj.className = "image" + angle;
            console.log(obj.className)
            if (angle == 360) {
                angle = 0;
            }
        }

        function moveLeft() {
            obj.style.left = parseInt(obj.style.left) - 5 + 'px';
        }

        function moveRight() {
            obj.style.left = parseInt(obj.style.left) + 5 + 'px';
        }

出于某种原因，这对我不起作用。

我还使用香蕉而不是俄罗斯方块片段在JSFiddle中重新创建了我的代码。

Answer 1

问题不在于你的Javascript，而在于你的风格。您需要绝对定位图像（在这种情况下为香蕉），并设置初始“左”值。 position: absolute;可以在HTML或CSS中设置，但必须在HTML样式属性中设置left: 0;。这是一个更新的jsfiddle更新。

Javascript：使用箭头键移动对象

1 个答案: