了解CodePen的IDE如何与2D射击游戏配合使用

时间:2018-04-06 00:28:38

标签: javascript html css codepen

我用一个单独的html文件中的所有代码制作了一个非常基本的2D射击游戏:(file_gist)。当我在我的原生Chrome浏览器中打开文件时,一切都与我的预期完全一致。但是,当我复制代码并将相应的HTML / CSS / JS放入IDE代码集的相应字段时,程序的行为并不符合预期。我可以看到JS正在使用我在程序中内置的可视文本指示,但是基于键盘输入向上,向下或向下移动的方形动画不会生成动画。 “子弹”也不会像预期那样有活力。想知道IDE如何以不同于我的本机浏览器的方式解释代码以及如何解决这个问题。

我认为这个问题可能与以下代码行有关,但我不确定:

document.addEventListener("keydown", keyBoardInput); 

Pen

1 个答案:

答案 0 :(得分:1)

我不确定它是如何运作的,但是要更改topleft,您需要附加单位,在这种情况下px

而不是player.style.left = playerLeft;,而是player.style.left = playerLeft + "px";

https://codepen.io/anon/pen/MVPvMJ