一个具有赛博朋克视觉风格的经典贪吃蛇网页游戏。游戏采用了毛玻璃(Glassmorphism)、霓虹光效以及动态背景,提供沉浸式的游玩体验。
- 炫酷的视觉设计:深色主题、发光动态环境以及赛博风格的界面排版。
- 用户账号系统:支持用户注册和登录,账号数据加密(简易哈希)存储在本地
localStorage。 - 数据跟踪与排行榜:记录用户的游戏历史、当前最高分,并实时更新全局排行榜。
- 跨平台适配:支持 PC 端使用方向键或
W/A/S/D进行控制;并完美适配移动端浏览与虚拟按键控制。 - 无框架依赖:纯 HTML5 Canvas、Vanilla CSS 和原生 JavaScript 编写。
无需复杂的构建流程,可直接依靠浏览器运行本项目:
- 克隆代码库:
git clone https://github.com/lengsousou/tcs.git
- 使用浏览器直接打开
index.html,或者为了更好的体验,可以通过本地服务器运行:npx serve . - 访问本地地址即可进入登录界面。
- 首次游玩请在首页进行注册并创建账号。
- 控制方向:按方向键
↑↓←→,或WASD。 - 空格键
Space控制开始 / 暂停。 - 保证蛇头不要撞击到墙壁或蛇身。吃到食物即可增加蛇身长度并获得积分。
tcs/
├── index.html # 登录/首页入口文件
├── game.html # 贪吃蛇游戏区域主页面
├── css/
│ └── style.css # 全局样式及所有视觉动画控制
├── js/
│ ├── auth.js # 处理注册、登录逻辑
│ ├── data.js # 处理排行榜、数据历史及分数系统
│ └── game.js # Canvas 画布操作及贪吃蛇的核心游戏循环逻辑
└── README.md
本项目仅供学习与娱乐使用。