1
は継続的に私はJavaScriptで可能ゲームのための非常に基本的なテストをしようとしてきたが、私はしにくいいくつかのバグに実行しているのKeyDown
function Parse(css) {
var a = "";
for (var i in css)
if (!isNaN(parseInt(css[i]))) a += css[i];
else break;
return parseInt(a)
}
function Player() {
return document.getElementById('PLAYER');
}
var P = {
HEIGHT: Parse(window.getComputedStyle(Player(), null).getPropertyValue('height')),
WIDTH: Parse(window.getComputedStyle(Player(), null).getPropertyValue('width')),
TOP: Parse(window.getComputedStyle(Player(), null).getPropertyValue('top')),
LEFT: Parse(window.getComputedStyle(Player(), null).getPropertyValue('left'))
};
document.addEventListener('keydown', function(k) {
switch (k.key.toLowerCase()) {
case 'arrowleft':
Object.assign(Player().style, {
left: `${P.LEFT - P.WIDTH}px`
});
break;
case 'arrowright':
Object.assign(Player().style, {
left: `${P.LEFT + P.WIDTH}px`
});
break;
case 'arrowup':
Object.assign(Player().style, {
top: `${P.TOP - P.HEIGHT}px`
});
break;
case 'arrowdown':
Object.assign(Player().style, {
top: `${P.TOP + P.HEIGHT}px`
});
break;
}
}, true);body {
width: 100%;
height: 100%;
margin: 0;
}
#PLAYER {
position: relative;
width: 32px;
height: 32px;
background-color: #000;
}<div id="PLAYER"></div>上の要素に長さを追加しますわかる。
私の黒いdivの正方形の要素（0,0にぴったりと）は、正方形で移動するだけでなく、それ自身の幅または高さを左または上の矢印キーが押された。
それは正直に驚嘆しています。
すべての入力とアドバイスは大変ありがとうございます。私はゲームを作る場面には全く新しいものです。
の問題は何ですか？デモするためにスタックスニップを作成できますか？ – guest271314
が追加されました。 – Scrow