前端知乎:js+div还原80后怀旧经典赛车游戏 谁说html5动画非得用canvas?
来源:互联网 发布:逆矩阵的运算法则 编辑:程序博客网 时间:2024/05/01 16:29
最近用js+div做了个赛车动画,动画很简单,就是仿古老的小型掌上游戏机里的赛车游戏。
核心代码其实就是怎么让车动起来。我的思路让车动其实就是让路动,用setTimeout来修改“路”的margin-top就可以。路边的障碍物就是一组数组,然后用数组创建div,判断碰撞就是判断“车”距离边缘的距离是否比“障碍物”的宽度大。
游戏里也涉及到html5元素audio的使用,还有html5震动API navigator。再就是引导页用了css3动画animation。其他的基本就是纯粹的就是js(jquery)操作dom了。
游戏页面:http://web.zhaicool.net/425.html
所有源代码也都在页面里面。直接查看源代码就行。
0 0
- 前端知乎:js+div还原80后怀旧经典赛车游戏 谁说html5动画非得用canvas?
- js经典赛车小游戏
- 一个JS动画框架-基于HTML5::Canvas
- HTML5+JS游戏开发模块----canvas打字游戏
- HTML5+JS游戏开发模块----canvas打字游戏升级版
- HTML5 Canvas核心技术:图形.动画与游戏开发
- 非html5实现js版弹球游戏
- html5之canvas动画
- html5 canvas气泡动画
- Js-Html 前端系列--点击非Div区域隐藏Div
- HTML5 canvas五子棋游戏
- html5 canvas 扫雷游戏
- HTML5 Canvas消除游戏
- HTML5+JS游戏开发模块----canvas图片拖放
- 前端之路——第五篇:1:1还原知乎首页顶层导航栏!
- 【Web前端】HTML5 Canvas小游戏
- 赛车游戏
- HTML5 Canvas 视差滚动动画
- Google的JSon——GSON生成JSon数据
- vim 编辑器使用学习
- RecycleView在TV应用中的焦点问题
- InnoDB Monitor
- json的概述和简单使用!
- 前端知乎:js+div还原80后怀旧经典赛车游戏 谁说html5动画非得用canvas?
- 转 rtc 实时时钟
- 导出excel
- Spring中Autowired注解,Resource注解和xml default-autowire工作方式异同
- 关于基于智能制造的综合监控平台的一点思考
- Zookeeper与paxos算法
- 基于sysvinit,udev的根文件系统构建
- Scala:Dynamic
- mysql技术内幕学习笔记-查询优化器及索引(一)