Question

如何让角色跳跃并与敌人发生碰撞和重力事件？

说我希望我的角色跳跃20px然后再回来但是如果没有地面，那么它们会继续下降。

这是我的编码，带有id人的div可以用箭头键左右向上移动但我需要这样做，当他跳跃时他会回来但如果他与另一个div碰撞他就太停止了但如果他不这样做，他就会继续摔倒。如果有任何机会你可以帮助我这样做，所以我可以按下跳跃按钮和一个移动按钮，这样他同时做两件事都会有所帮助

document.body.addEventListener('keydown', function(){move()});


function move(){
var spot = document.getElementById('person').offsetTop;
var lr = document.getElementById('person').offsetLeft;
var y = spot + 5;
var z = spot - 5;
var w = lr + 5;
var v = lr - 5;

var map = []; // Or you could call it "key"
onkeydown = onkeyup = function(e){
    e = e || event; // to deal with IE
    map[e.keyCode] = e.type == 'keydown';
    /*insert conditional here*/
if(map[38]){
		document.getElementById('person').style.top = z + "px";
	}else if(map[37]){
		document.getElementById('person').style.left = v + "px";
	}else if(map[39]){
		document.getElementById('person').style.left = w + "px";
	}
}
}

<div id="person" style="width: 20px; height: 20px;top:490px; position: absolute ; background-color:#00F"></div>
<div id="ground" style="width:auto; position:relative; top:500px; height: 5px; background-color:#000"></div>
<div id="wall" style="width: 30px; height:30px; top:470px; left:100px; position:relative; background-color:#000"></div>

Answer 1

这里有一点博弈论。您应该阅读有关如何最好地实现所需效果的文章或教程。

你的地面和角色都是游戏对象，可能都有宽度，高度，x和y的共同对象。

如果玩家没有与y轴（在其下方）移动角色的对象发生碰撞，则需要在每次更新时对角色应用重力值。

.(x,y)----------
|              |
|              |
|              |
|              |
|              |
----------------

Where player.x and y is the top left of it's box

您可以使用player.y-player.length计算此碰撞（让您到达玩家的底部）>=大于或等于ground.y地面的上方位置。在这种情况下，不要施加重力。

对于弓箭，您只需检查左，右，底部和顶部不会与另一个物体发生碰撞。

Answer 2

您最好的选择是评估物理库，例如Matter.js或PhysicsJS。您还可以在Hive HBase Integration

查看其他评估

如何为跳跃的人做出碰撞事件

2 个答案: