首页 > web前端 > js教程 > 正文

JS和H5编写推箱子游戏

小云云
发布: 2018-03-17 16:24:49
原创
2065 人浏览过


推箱子小游戏是一款多年前很流行的小游戏(即使现在也有很多人玩),游戏目的很简单,就是人推箱子,把所有的箱子推到目的地,就游戏成功:看似跟简单的逻辑,其实还是有一定难度的,我也是依靠了别人的帮助才完成的,现在开始介绍如何用js,html5编写该游戏(方便起见我们把人用一个粉圆形代替):

一.能力要求

JavaScript,HTML画布,面向对象的基本思想,合理的编程逻辑。

二.编写顺序

1.pushBox.html文件

2.pojo.js文件(用来存放所有的对象)

3.paint.js文件(用来写画画的语句)

4.game.js文件(用来写运行逻辑部分)

5.allLevels.js文件(用来存放关卡)

*注:这是我的书写习惯,按内容和功能将个各类分开,如有更好地写法欢迎评论

三.开始编写

1.建立基本的pushBox.html文件:

内容很简单,里面仅仅需要标签,设置id,其后的

<body>
	<canvas id=&#39;can1&#39; width=1536 height=733></canvas>
	<audio id="walk" autoplay></audio>
	<audio id="push" autoplay></audio>
	<audio id="win" autoplay></audio>
</body>
登录后复制

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板