前端知乎:js+div还原80后怀旧经典赛车游戏 谁说html5动画非得用canvas?

最近用js+div做了个赛车动画,动画很简单,就是仿古老的小型掌上游戏机里的赛车游戏。

核心代码其实就是怎么让车动起来。我的思路让车动其实就是让路动,用setTimeout来修改“路”的margin-top就可以。路边的障碍物就是一组数组,然后用数组创建div,判断碰撞就是判断“车”距离边缘的距离是否比“障碍物”的宽度大。

car


游戏里也涉及到html5元素audio的使用,还有html5震动API navigator。再就是引导页用了css3动画animation。其他的基本就是纯粹的就是js(jquery)操作dom了。

游戏页面:http://web.zhaicool.net/425.html

所有源代码也都在页面里面。直接查看源代码就行。


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值