HTML+CSS+JavaScript实现植物大战僵尸(附演示地址)

作者: C you again,从事软件开发 努力在IT搬砖路上的技术小白
公众号:C you again】,分享计算机类毕业设计源码、IT技术文章、游戏源码、网页模板、程序人生等等。公众号回复 【粉丝】进博主技术群,与大佬交流,领取干货学习资料
关于转载:欢迎转载博主文章,转载时表明出处
求赞环节:创作不易,记得 点赞+评论+转发 谢谢你一路支持

本游戏演示地址:植物大战僵尸演示地址

1、游戏介绍

    《植物大战僵尸》是由PopCap Games开发的一款益智策略类单机游戏

    玩家通过武装多种植物切换不同的功能,快速有效地把僵尸阻挡在入侵的道路上。不同的敌人,不同的玩法构成五种不同的游戏模式,加之黑夜、浓雾以及泳池之类的障碍增加了游戏挑战性。

    《植物大战僵尸》集成了即时战略、塔防御战和卡片收集等要素,玩家控制植物抵御僵尸的进攻,保护这片植物园。游戏中可以选用的植物有40多种,而每个场景最多只能选用10种植物,这就需要玩家根据自己的游戏策略来作出取舍。因为它成功地借鉴了一些战略游戏的要素——采集资源并利用资源建造其它单位,有些玩家甚至拿星际的战略往这款游戏中套用,以阐述这款游戏需要在何时发展“经济”,何时发展“兵力”。

    这款游戏要求玩家既有是大脑的智慧,又有小脑的反应。在有了正确的战略思想之后,还要靠战术将战略实现出来。战术范围包括很广,植物的搭配、战斗时的阵型、植物与僵尸相遇时是战是防这都属于战术的范畴。正确的战术是玩家在战斗中胜利关键。选择正确的战术,需要先分析情况,再做出决定。那么提高战术水平也是要提高分析情况的能力。

注:以上文字来源于百度百科

2、游戏说明及效果展示

    本文通过HTML+CSS+JavaScript实现简单的植物大战僵尸小游戏,并附有演示地址,点击这里试玩
在这里插入图片描述

    游戏分为冒险模式和小游戏模式,如下图:
在这里插入图片描述
冒险模式有第一大关、第二大关。
第一大关包括十个冒险关卡,大二大关目前有两个关卡,你可以进行二次开发,扩展关卡。效果图如下:
在这里插入图片描述
在这里插入图片描述

小游戏模式有“超乎寻常的压力”、“你的心脏够强劲吗”、“僵尸快跑”、“乱墓”等关卡,效果图如下:
在这里插入图片描述
游戏的整个文件结构如下:
在这里插入图片描述

3、游戏中部分植物介绍

在这里插入图片描述

Peashooter豌豆射手
耐久:300
临界点: 0
攻击:20
射程:正前方一整行
射击间隔:1.4秒
价格: 100阳光
冷却时间:7.5秒
可栽种于草地/睡莲/花盆
特性:每次攻击射出一发豌豆

在这里插入图片描述

SunFlower向日葵
耐久:300
临界点: 0
生产间隔:24秒
价格: 50阳光
冷却时间: 7.5秒
可栽种于草地/睡莲/花盆
特性: 每24秒生产一个中型阳光(25阳光值)

在这里插入图片描述

Cherry Bomb樱桃炸弹
耐久:300
临界点:0
攻击:1800
范围: 以自身为圆心爆炸半径为1.5格的圆形
准备时间: 3.5秒
价格:150阳光
冷却时间:50秒
可栽种于草地/睡莲/花盆
特性: 杀伤范围内大杀伤力爆破

在这里插入图片描述

Wall-nut坚果墙(坚果,墙果)
耐久:4000
临界点:0
损伤点1:int(MAX HP2/3)
损伤点2:int(MAXHP
1/3)
价格:50阳光
冷却时间: 30秒
可栽种于草地/睡莲/花盆
特性:以高耐久阻挡僵尸前行

在这里插入图片描述

Snow Pea寒冰射手(雪花豌豆)
耐久:300
临界点:0
攻击:20
射程: 正前方一整行
射击间隔: 1.4秒
价格:175阳光
冷却时间:7.5秒
可栽种于草地/睡莲/花盆
特性:每次攻击发射一颗冰豌豆,命中目标后附带冰减速效果持续10秒(被减速目标移动/攻击速度减半)

在这里插入图片描述

Chomper大嘴花(咀嚼者,食人花)
耐久:300
临界点:0
攻击:1800,对巨人僵尸每次40,可秒杀高坚果僵尸
范围:正前方约1.5格
咀嚼时间:42秒
价格:150阳光
冷却时间: 7.5秒
可栽种于草地/睡莲/花盆
特性:吞下一个自己可以吞食的僵尸,但在咀嚼僵尸的过程中十分脆弱

在这里插入图片描述

Puff-shroom小喷菇(喷射蘑菇)
耐久:300
临界点:0
攻击:20
射程: 正前方3格
射击间隔:1.4秒
价格:0阳光
冷却时间: 7.5秒
可栽种于草地/睡莲/花盆
特性:每次攻击喷出一次孢子 白天会睡觉

在这里插入图片描述

Grave Buster墓碑吞噬者(咬咬碑,墓碑苔藓)
耐久: 300
临界点:0
吞噬时间: 4.5秒(从安放到移除墓碑)
价格:75阳光
冷却时间: 7.5秒
只可种植于墓碑上
特性: 移除墓碑恢复可种植草地吞噬完会获得银币、金币、钻石、巧克力或盆栽,吞噬过程中若被僵尸吃掉,墓碑会恢复原状

4、源码下载与演示

益智类游戏大全:请点击这里查看

本游戏演示地址:植物大战僵尸演示地址

源码下载地址:点击这里快速下载源码

注:以上大部分图片与文字来源于百度百科,源码来源于网络,若有侵权,请联系删除。

  • 6
    点赞
  • 35
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
提供国人写的强大的html5植物大战僵尸(源码) 写得很棒~占用资源少。 JSPVZ 程序制作进度(2011.1.5) 本程序提供源码由HTML5中文网整理打包下载,该下载包可以使用服务器环境运行,也可以在电脑上双击Index.htm直接运行 另外智能手机可以安装OperaMobile10.1及其以上版本,把代码整个拷贝到手机存储卡上,在浏览器中输入形如“E:/jspvz”形式的地址直接本地运行程序,无需联网 转载使用请勿修改LonelyStar署名,pvz.lonelystar.org网址和PopCap公司版权声明 保留对该JS版植物大战僵尸版权所有 2011.1.5 添加了第二大关的第三小关 修正一大波和最后一波字样无法消失的BUG 2010.12.31 添加了“解谜模式” 调整了程序中关卡对于胜利和失败的算法 几个植物和僵尸做了调整 修改了几个BUG 2010.12.27 对初始界面稍作修改 2010.12.9 添加了“靠天吃饭”小游戏 给领带僵尸添加两种形象 修正辣椒爆炸图片的问题 咖啡豆0耗的数据修正 2010.12.8 提高了一下僵尸行走的纵坐标 修正了土豆雷和樱桃炸弹爆炸图片在IE下的问题 调整了一大波僵尸和最后一波僵尸出现的图片效果 2010.12.7 添加了第二大关的两小关 添加了“乱葬岗”小游戏 修改了几个BUG 调整了进度显示 2010.12.1 添加了“贫瘠之地”小游戏 调整游戏初始化界面和选择模式界面 修正第十关IE下运行报错的BUG 修正IE下单机运行有部分图片看不到的问题 修正蘑菇植物无睡眠动画而实际却在睡眠的BUG 修正曾哥蘑菇种植在醒着的大喷菇上仍然睡着的BUG 修正僵尸出场界面显示僵尸种类的BUG 修正地刺和地刺王伤害过高的BUG 加大“僵尸快跑!”的难度

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值