不知道大家在使用Chrome浏览器的时候有没有玩过这样的恐龙游戏：这款404游戏是谷歌ChromeUX团队在2014年开发的，游戏嵌入谷歌浏览器后受到了用户的好评，甚至每月有2.7亿次游戏。小恐龙跑酷游戏画面简洁，游戏简单。玩家只需操作小恐龙跳过沙漠中随机出现的仙人掌，当小恐龙不小心撞到仙人掌时，就意味着游戏结束，GAMEOVER。作为网页游戏，小恐龙可以用HTML+CSS+JavaScriptLightly实现。代码：https://179f55890e-share.ligh...小恐龙游戏原理这个游戏的操作逻辑可能比想象的要简单。图中的小恐龙虽然看起来是在奔跑，但实际上他只是在奔跑，只是在上下跳跃，真正移动的是一块画布，上面有随机的仙人掌，所以操控恐龙只是上下两个键。在定位小恐龙和地面让小恐龙跑起来之前，我们需要先将小恐龙定位在游戏画布上，固定好小恐龙出现的地方。同时，我们还需要固定地面的位置，让程序知道小恐龙会踩到哪块土地。前面说过，游戏中的小恐龙其实是在原地跳跃，所以我们只需要通过update()函数将地面无限向左滚动即可。create(){this.gameSpeed=10;//其余代码}update(){this.ground.tilePositionX+=this.gameSpeed;}让小恐龙跳跃create(){//其余代码this.dino=this.physics.add.sprite(0,height,'dino-idle').setCollideWorldBounds(true).setGravityY(5000).setOrigin(0,1);this.createControll();}createControll(){this.input.keyboard.on('keydown_SPACE',()=>{if(!this.dino.body.onFloor()){return;}this.dino.setTexture('dino',0);this.dino.setVelocityY(-1600);})}setGravityY会给小恐龙增加重力，这里是5000；如果不设置setColliderWorldBounds，小恐龙会无视地面，直接掉出屏幕，嗯。最后，添加控件。每当我们按下空格键，小恐龙就会以每秒1600的速度上升，也就是在那一秒抵消部分重力，达到跳跃的效果。最后自然是加入了数十亿的细节来让恐龙实现奔跑的效果，还加入了不同种类的仙人掌，让小恐龙穿越沙漠的过程不那么枯燥。查看小恐龙完整源码：https://179f55890e-share.ligh...如何用Lightly打开和编辑别人分享的项目？Lightly-下一代HTML+CSS+JavaScriptIDE
