首页 文章

在jQuery中移动一个对象(Mario风格)

提问于
浏览
2

我试图在jQuery中创建一个近乎完美的对象移动 . 我尝试了几种方法,但似乎没有一种方法是完美的 . 我试过了:

  • 按键 - >按x像素数移动

  • 按键 - >按x像素数设置动画

一次移动几个像素使其看起来有些滞后和糟糕 . 我想大家都同意这一点 . 然后我发现有人使用动画来改变轴的坐标(基本上将对象的左边属性更改为更大或更小):

http://jsfiddle.net/2L86bdw0/1/

$('.user').animate({
    left: '+=500'
},{
    duration: 1000,
    easing: 'linear',
}).dequeue();

这基本上在1000毫秒内将其移动500像素 . 这使得运动非常平滑,似乎是最好的方法 .

然而 . 尝试按住向右箭头然后向左 . 它应该开始向左移动,它做到了 . 但是,当您从左箭头移开手指时,它应该再次向右移动(假设您仍然按住右箭头) . 但事实并非如此 .

我一直在寻找最好的方法来做到这一点,但是,我还没有找到一个好的解决方案 . 我想创建一个马里奥风格的网站,但我不能让运动接近完美 . 帮助赞赏 .

2 回答

  • 2

    您必须跟踪当前按下的键 . 我的第一个想法是堆栈,但这不起作用,因为你可以按照你按下它们的不同顺序释放键 . 所以我想你可以用数组或链表来做到这一点 . 按下按键将其按到列表中,并在释放时将其删除 . 向后处理密钥 . 因此,在主循环中,您将检查列表中的最后一个键并处理其方向 .

  • 2

    游戏引擎通过使用不同的按键状态解决了这个问题:

    keypress,keydown,keyup

    按键是第一个按下按键的循环 .
    keydown是一个键已激活的第二个循环 .
    keyup是第一个循环,不再按下以前keydown的键 .

    您将要模拟的基础知识是查看自上一个循环以来是否按下了新键并使用该新键作为动画的方向 . 并且keyUp应该查看自上次更新后是否不再按下某个键,然后减慢被操纵的对象以减慢其速度,最终停止它(如果您坚持使用马里奥加速而不是立即停止) .

    我建议存储一个“lastkey”变量,并将其与当前的keydowns进行比较 .

相关问题