前端小游戏
关注
分享
扫一扫
文章平均质量分 95
青花锁
大吉大利，青花科技
展开
-
Canvas动画之豌豆射手大战僵尸
- 创建僵尸图片对象- 创建僵尸对象（定义2D的坐标系数、大小、血量、被豌豆射击命中函数）- 修改僵尸绘图函数（上一章已存在僵尸绘图函数，把僵尸、僵尸的血条绘制到Canvas画板上）- 在豌豆子弹函数里，增加豌豆与僵尸的碰撞检测，调用僵尸被豌豆射击命中函数原创 2024-02-27 17:27:20 · 1793 阅读 · 33 评论 -
Canvas动画之豌豆射手
实现豌豆射手自动发射豌豆效果可以通过创建一个Canvas元素，并在上面使用JavaScript来绘制豌豆射手，豌豆从豌豆射手那里自动往前射击，到画布外之后子弹消失。并为整个画面设置一张草坪背景，意味着豌豆射手是在草坪上战斗。分为2部分，Html画布（Canvas元素容器，设置草坪背景）、JavaScript脚本控制豌豆从豌豆射手那里自动往前射击。原创 2024-02-26 15:36:01 · 3976 阅读 · 14 评论 -
Canvas魔法之黑客帝国特效
今天我们实现黑客帝国（The Matrix）风格的字母掉落效果。使用工具：Chrome浏览器（或其他支持H5的浏览器）使用语言：HTML + JavaScript + Canvas + requestAnimationFrame原创 2024-02-26 11:34:46 · 5884 阅读 · 7 评论 -
【Web】 CSS引用方式
想用CSS修饰网页，就需要在HTML文档中引入CSS。CSS提供了4种引用方式，分别是行内式、内嵌式、外链式和导入式。原创 2024-01-08 18:52:26 · 2151 阅读 · 15 评论 -
华为云云耀云服务器L实例评测 | Linux系统宝塔运维部署H5游戏
本章节内容，我们主要介绍华为云耀服务器L实例，从云服务的优势讲起，然后讲解华为云耀服务器L实例资源面板如何操作，如何使用宝塔运维服务，如何使用运维工具可视化安装nginx，最后部署一个自研的H5的小游戏（6岁的小朋友玩的很开心😁）。前端的同学如果想把自己的作品通过互联网展示出来的，希望这篇文章可以给前端同学一点借鉴，在此㊗️大家中秋节快乐。原创 2023-09-14 20:00:14 · 7302 阅读 · 77 评论 -
【Vue3 博物馆管理系统】使用Vue3、Element-plus菜单组件构建前台用户菜单
Element-plus导航菜单默认为垂直模式，通过mode属性可以使导航菜单变更为水平模式。上一章节我们的页面布局，顶部采用横向导航菜单布局，也就是水平模式的菜单，因此需要水平模式的导航菜单。原创 2023-08-11 09:43:38 · 2632 阅读 · 9 评论 -
【数据结构与算法】Vue3实现选择排序动画效果与原理拆解
选择排序基本步骤：1、找到未排序部分中的最小元素。2、将该最小元素与未排序部分的第一个元素交换位置，将其纳入已排序部分。3、在剩余未排序部分中重复步骤1和2，直到所有元素都被纳入已排序部分。原创 2023-08-09 16:07:00 · 1570 阅读 · 98 评论 -
[JavaScript游戏开发] Q版地图上让英雄、地图都动起来
本文简单介绍Q版地图的绘制，地图/英雄的移动、边界检测，喜欢的同学可以参考第二张把自动寻径加上。原创 2023-08-06 22:04:11 · 2160 阅读 · 108 评论 -
[JavaScript游戏开发] 绘制Q版地图、键盘上下左右地图场景切换
本文仅仅简单介绍地图的移动，后续以此为基本，实现地图跟随英雄人物动态移动功能原创 2023-08-02 12:04:17 · 4964 阅读 · 139 评论 -
[JavaScript游戏开发] 绘制冰宫宝藏地图、人物鼠标点击移动、障碍检测
本文仅仅简单介绍了其中一种地图（冰宫宝藏）的绘制，后续还会推出更多地图，比如：问道、梦幻西游、传奇等游戏的地图。原创 2023-07-26 21:30:28 · 3056 阅读 · 69 评论 -
[JavaScript游戏开发] 跟随人物二维动态地图绘制、自动寻径、小地图显示(人物红点显示)
本文仅仅简单介绍了地图y轴的动态绘制、自动寻径、小地图显示，后续还有血量、陷阱、空投大礼包、喷子武器使用、护盾、多种障碍物等多种玩法需要实现。原创 2023-07-23 18:54:26 · 2330 阅读 · 75 评论 -
[JavaScript游戏开发] 2D二维地图绘制、人物移动、障碍检测
本文仅仅简单介绍了2D二维地图绘制、人物移动、障碍检测，可以根据此开发出自动寻径避障、多障碍物绘制、NPC自动出现并移动、人物动画动作、多地图切换、装备仓库、装备效果等。例如：推箱子、走迷宫、副本游戏、熊猫吃竹子等原创 2023-07-19 21:16:00 · 93856 阅读 · 124 评论