Html5小游戏之小小塔防

很久没有更新博客了，最近比较忙，而且也没什么idea！

最近看了一个坦克大战的html5源码，发觉颇有收获。所以抽空写了一个相对于以前的小游戏复杂些的塔防游戏！也算是一种对于自身的突破！

虽然是demo版，也不能太丑，所以我还是找了一些素材图片，找素材图片还真麻烦！

 

本次用到了5个canvas画布标签！

map：用于绘制背景地图，基本上画上一次就不会重画。

main：用于绘制敌人与子弹，因为这两个基本上会一直变，需要一直重画。

tower：用于绘制塔，塔基本上画上去后，不会动，最多也是会给擦出。

select：用于绘制塔的选择区域，攻击范围等，会根据用户的操作而进行重画画布。

info：用于绘制游戏的基本数据信息，会跟据金钱分数关卡等数据而变化。

 

该游戏支持ff,chrome,ie9,safari。ie6,7,8就不支持了，你懂，其余的没测试过，理论上支持html5的浏览器都能用。

 

说明：每种塔都可以升级到3级，升级的价格与本身建造相同，卖掉的话就是总额的一半。

  第一种塔：升级到3级，有小偷功能，每攻击一次会偷取1块钱。

  第二种塔：减速攻击，3级时可以同时减速两个。

  第三种塔：多重攻击。攻击多个目标。

  第四种塔：穿刺攻击，攻击一条线上，攻击力最高。

  第五种塔：秒杀攻击，有一定几率把敌人秒杀。

 

选择地图 地图一 地图二 ,然后按开始游戏！

 

 bug肯定也会有。。源码有注释，希望大家能看得懂，也希望能给那些跟我一样刚学习html5的人一点点帮助！有不懂，有bug，都可以直接私信，我很乐意回答！

 

这是源码-》完整源码