比如我要做一个微信的飞机大战, 要用键盘控制飞机的移动。我用的办法是监听键盘的上下左右按键,每次事件发生时,让飞机这个p的left和top发生变化(即增加或减少ins), 但是如果ins很小,那么移动飞机很累。如果ins很大,那么移动很突兀, 而且飞机的移动会有盲区。这要如何解决呢?
p
left
top
ins
拥有18年软件开发和IT教学经验。曾任多家上市公司技术总监、架构师、项目经理、高级软件工程师等职务。 网络人气名人讲师,...
首先建議不要直接使用 Dom 來寫遊戲,Dom的操作算是挺消耗資源的,當物件一多,瀏覽器的重繪肯定會造成不流暢甚至卡死的問題。
Dom
建議是利用 Canvas 和 WebGL 來配合 Javascript 寫遊戲,一些HTML5遊戲框架也很好用,例如
Canvas
WebGL
Javascript
pixi.js
首先如上楼所说,绝对不要用DOM去写游戏,也没有哪个游戏是用DOM写的。其次,如果仅从动画层面考虑,通过改变DOM元素的left,top等会影响DOM结构的属性来形成的动画,效果还不如css3的translate,你可以去尝试比较两种动画的性能。最后,建议使用canvas,它提供了丰富的API,基本可以满足你做打飞机游戏的需求。根据你问题的需要,你可以参考我这篇文章中,文章末尾太空船的示例代码《每周一点canvas动画》——速度与加速度(2)
首先建議不要直接使用
Dom
來寫遊戲,Dom
的操作算是挺消耗資源的,當物件一多,瀏覽器的重繪肯定會造成不流暢甚至卡死的問題。建議是利用
Canvas
和WebGL
來配合Javascript
寫遊戲,一些HTML5遊戲框架也很好用,例如pixi.js
首先如上楼所说,绝对不要用DOM去写游戏,也没有哪个游戏是用DOM写的。
其次,如果仅从动画层面考虑,通过改变DOM元素的left,top等会影响DOM结构的属性来形成的动画,效果还不如css3的translate,你可以去尝试比较两种动画的性能。
最后,建议使用canvas,它提供了丰富的API,基本可以满足你做打飞机游戏的需求。根据你问题的需要,你可以参考我这篇文章中,文章末尾太空船的示例代码《每周一点canvas动画》——速度与加速度(2)