html格斗游戏,对打游戏

不用引擎,不用画布canvas,不用任何库(包括jquery), 原生div+img组件,开发格斗游戏
游戏教程视频已经上传 b站:https://www.bilibili.com/video/av89986087/

接下来会陆续发布该游戏的开发教程。

大家好,我是居家懒人,现在是2020年,我在湖北老家过春节,嗯~~~,因为这次武汉冠状病毒,大家都憋在家,都说呆在家里不出门,就是对国家最好的贡献,各位兄弟姐妹们,有没有坚持室内健身和学习呢

我的职业是做IT农民,就是什么也不会,生活圈子狭窄,只会写代码的码农
宅在家这些天,吃的很好,但是睡的其实不好,因为心里头空空的,躺在床上很晚了却睡不着,直到一天我翻出了自己的记事本里的一个记录之后
 
接下来的几天作息时间才有了一些节奏,我记事本里这个想法就是用原生html写一个小游戏,看看能做到什么程度。
 
对了介绍一下我的工作,感觉慢杂乱的,做过技术主管,开发过手游,页游,app,还开发过小程序,甚至还做过flash动画广告制作,那是我大学毕业后早报纸上找到的第一份工作. 大学的一个兴趣就是玩flash,做各种时间轴动画,加上一点点似懂非懂的代码让图片跟随鼠标位移什么的,不过后来因为我没有美术功底,然后想找编程相关的工作,做了几个月就离开了。

说到游戏开发,都离不开讨论现在流行的游戏引擎,我也做了简单的归纳:

好,有点跑题了,回到我的关于html的话题,在很多年前,html5标准还没有普及,甚至现在html中的canvas组件还没有,也就是不支持webgl出现的时候,听说,不知道是国内还是国外的大牛高玩,写出了html版本的星际争霸,我没玩过。
 
刚才说到我要用原生html写一个小游戏,那么具体是个什么类型呢:答案是对打游戏,可能会有懂行一些或者比较认真的小伙伴们要问,
 
"什么?你要用html开发一款对打游戏?用html标签那种写UI的组件来开发?现在都是采用成熟的游戏引擎的年代了,你做这件事情有什么意义?"
 
嗯,我要说,我没想过把这个游戏做的很完善或者体验很好,我的目标是实现一些基本的功能就打住,不再玩后开发,所以也没有想过把这个游戏做上线,毕竟时间有限,而我的记事本里接下来要做的事情还有很多
 
那么这个小游戏就是我爱折腾,想要动手实践一下而已,真的就是一个非常小非常小的小游戏,没有很酷炫的技能特效,也没有给人带来沉浸感的光线,阴影效果,其实可以看到仅仅是几张图片被我控制来回跑来跑去而已, 只能算是做一个demo,一次尝试。
 
我在网上找了两个人物角色,决定自己ps一下直接用,
 
不知道玩dota的伙伴,喜不喜欢屠夫这个角色,或者现在王者荣耀的伙伴,爱不爱玩钟馗,他们的技能是我最喜欢的,就是钩子技能,于是我自己给钢铁侠弄了个仍钩子的技能,
 
扔出去把对手勾过来,然后咬一口,但是我没有美术功底,所以就用一团火焰来代表发动攻击了,
 
右边这个角色我起名叫做盔甲幽灵,他的技能就是蓄力攻击,蓄力越久,扔出的长矛越远
 
游戏的角色技能的平衡我其实没有想太多,盔甲幽灵因为比较很难打到人,所以给他的攻击值设的比较高
 
怎么样,两个角色是不是仔细看有些得瑟,摇头晃脑的
左边人物走路,右边人物走路,左边人物跳跃,右边人物跳跃
我直接把我当前的书桌拍下来,做成了游戏背景,可以随人物移动的时候水平滚动
 
 
好了,算是一个开篇介绍,内容做的比较仓促,感谢兄弟姐妹们看到这里,从下一期开始,我就会逐步的给大家讲解,这个看起来比较无聊的小游戏的步骤。
嗯,下期再见。

都闪开,不用任何游戏引擎,html也能开发格斗游戏的更多相关文章

  1. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇:简介及目录》(附上完整工程文件)

    G-3D引擎2D射击类游戏制作教程 游戏类型: 打飞机游戏属于射击类游戏中的一种,可以划分为卷轴射击类游戏. 视觉表现类型为:2D 框架简介: Genesis-3D引擎不仅为开发者提供一个3D游戏制作 ...

  2. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇08:弹幕系统》本系列完结

    8.弹幕系统 弹幕系统概述: 弹幕系统的设计体现了射击游戏的基本要素,玩家要在敌人放出的大量子弹(弹幕)的细小空隙间闪避,能在玩家闪躲弹幕的时候给玩家带来快感,接近满屏的子弹,增加了对玩家的视觉冲击力 ...

  3. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇05:角色中弹》

    5.角色中弹 概述: 为了使游戏具有挑战性,大部分游戏设定中,游戏角色都有生命限制.即在游戏中,由于玩家的操控操控不当,导致游戏角色死亡游戏终止.打飞机游戏也不例外,当敌人击中角色的时候,角色宣判死亡 ...

  4. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇04:碰撞检测》

    4.碰撞检测 碰撞概述: 游戏世界里,游戏对象不能做出如同在真实世界里的物理运动效果.对于大部分游戏来说,都要为其添加物理系统,让其可以模拟真实世界发生的物理运动.但是在这个打飞机游戏Demo中,是用 ...

  5. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇03:子弹发射》

    3.子弹发射 子弹发射概述: 在打飞机游戏中,子弹是自动发射的.子弹与子弹之间间隔一定的时间,玩家通过上下左右控制游戏角色,来达到躲避敌人及击中敌人的操作. 发射原理: 抽象理解为有两个容器存放子弹, ...

  6. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇02:滚屏》

    2.滚屏 滚屏概述: 打飞机游戏场景背景设计通常很简单,因为角色敌人道具等都不与背景发生交互事件.开发者只需要根据设定的游戏类型,为游戏制作背景,模拟一个大环境即可. 滚屏原理: 材质UV动画,实现背 ...

  7. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇07:全屏炸弹》

    7.全屏炸弹 全屏炸弹概述: 为了增设游戏的趣味性,我们制作一个游戏的基本框架以外.还会增设一些其他的额外的功能.比如5秒无敌状态.冰冻效果等.下面咱们以消灭屏幕中所有炸弹为例,看除了碰撞可以触发事件 ...

  8. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇06:计分》

    6.计分 计分概述: 分值计量直接反应玩家在游戏中获得的成就感.因此,计分系统在游戏中显得尤为重要,有的反应在直接获取的分数上,有的反应在杀敌数量上等. 计分原理: 原理图,如图6-1所示. 图6-1 ...

  9. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇01:播放序列动画》

    1.播放序列动画 系列动画播放概述 2D游戏中的动画系统,不同于3D游戏.3D游戏中,角色美术资源不仅包含角色模型的,还包括角色的贴图和动作等,模型本身自带角色的动作动画效果.2D游戏中,角色美术资源 ...

随机推荐

  1. 《大厂面试》京东+百度一面,不小心都拿了Offer

    你知道的越多,你不知道的越多 点赞再看,养成习惯 本文 GitHub https://github.com/JavaFamily 已收录,有一线大厂面试点思维导图,也整理了很多我的文档,欢迎Star和 ...

  2. Netty快速入门(02)Java I/O(BIO)介绍

    BIO简介 Java I/O,也叫Blocking I/O,也就是阻塞式I/O. BIO的流程比较简单,在服务端创立一个ServerSocket去监听,等待连接.客户端创建一个Socket连接过来,服 ...

  3. php配置xdebug插件,断点调试

    xdebug 下载地址:https://xdebug.org 1.项目目录下新建phpinfo(); 文件: 2.快速查找符合自己的phpxdebug插件: https://xdebug.org/wi ...

  4. 【LC_Lesson5】---求最长的公共前缀

    编写一个函数来查找字符串数组中的最长公共前缀. 如果不存在公共前缀,返回空字符串 "". 示例 1: 输入: ["flower","flow" ...

  5. 【LC_Lesson1】--字符串反转练习

    LeetCode算法练习题目一: 给定一个字符串,要求将该字符串反转后输出 努力学习,天天向上.借助LeetCode的题目,练习编码能力,数据结构,以及C++和Python的编码能力. 一. 算法实现 ...

  6. HttpClient工具类的使用

    package com.hourui.gmall.util; import org.apache.http.HttpEntity; import org.apache.http.HttpStatus; ...

  7. 聊聊HTTP请求那一些事_HttpWebRequest_一篇就够了

    ​最近工作比较忙,很久没有写东西了,今天抽点时间整体一下最近工作的一个知识点小结.http请求对我们来说一点都不模式,程序员的我们有可能天天就是和这一些打交道.无论是BS架构的程序,前后端的数据交互, ...

  8. python 判断文件的字符编码

    import chardet f = open(file='test1.txt', mode='rb') data = f.read() print(chardet.detect(data))

  9. 对于Makefile的基本使用

    上课不听讲的后果就是课下疯狂补知识了 原文来自https://www.cnblogs.com/chenguanfu/p/4415072.html 在Windows下,只需要简单的点击以下make,re ...

  10. 深入Node模块Buffer-学会操作二进制

    Buffer 作为 nodejs 中重要的概念和功能,为开发者提供了操作二进制的能力.本文记录了几个问题,来加深对 Buffer 的理解和使用: 认识缓冲器 如何申请堆外内存 如何计算字节长度 如何计 ...