两年之后再回来看，这都写的啥狗屎玩意儿。。。那时候都不会用回调，而且setTimeout嵌套setTimeout都是些什么鬼。。。
渲染慢是因为赛车移动的时候更改的margin-top，改成transform: translate来修改位置会流畅很多；音频问题、震动问题随着手机的不断升级，效果也越来越好。
不过也懒得改代码了，凑合着看吧。。。
======================================
最近用js+div做了个赛车动画，动画很简单，就是仿古老的小型掌上游戏机里的赛车游戏。
游戏页面：http://zhaicool.net/drive/index.html所有源代码也都在页面里面。直接查看源代码就行。核心代码其实就是怎么让车动起来。我的思路让车动其实就是让路动，用setTimeout来修改“路”的margin-top就可以。路边的障碍物就是一组数组，然后用数组创建div，判断碰撞就是判断“车”距离边缘的距离是否比“障碍物”的宽度大。
游戏里也涉及到html5元素audio的使用，还有html5震动API navigator。再就是引导页用了css3动画animation。其他的基本就是纯粹的就是js（jquery）操作dom了。
这个游戏功能上虽然实现了，但是在手机端还有以下几处不足：
1、性能问题，可能是出现的div过多，造成渲染的卡顿；
2、声音问题，手机端同时只能播放一种声音，比如如果我给方向键也加上音效，那么按方向键的时候背景乐就会自动停止。暂未找到解决方案；
3、震动问题，震动会有延迟，大约延迟一秒钟才震动。
4、手机端window.close()无法关闭页面。
5、没有仔细做兼容，所以建议用chrome或firefox，而且是新版本查看。
未经允许不得转载：前端撸码笔记 » js+div还原80后怀旧经典赛车游戏 谁说html5动画非得用canvas？