HTML游戏之贪吃蛇

最新推荐文章于 2024-06-24 09:39:07 发布

马克图布No1

最新推荐文章于 2024-06-24 09:39:07 发布

阅读量260

点赞数

分类专栏： HTML 文章标签： html 游戏

本文链接：https://blog.csdn.net/weixin_40271376/article/details/103647211

版权

本文介绍了使用HTML制作经典游戏贪吃蛇的过程，通过代码分享来自GitHub作者Steven Lambert的实现方案。

摘要由CSDN通过智能技术生成

HTML游戏之贪吃蛇Snake，代码来自github作者Steven Lambert

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <style>
  html, body {
   
    height: 100%;
    margin: 0;
  }

  body {
   
    background: black;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  canvas {
   
    border: 1px solid white;
  }
  </style>
</head>
<body>
<canvas width="400" height="400" id="game"></canvas>
<script>
var canvas = document.getElementById('game');
var context = canvas.getContext('2d');

var grid = 16;
var count = 0;
  
var snake = {
   
  x: 160,
  y: 160,
  
  // snake velocity. moves one grid length every frame in either the x or y direction
  dx: grid,
  dy: 0,
  
  // keep track of all grids the snake body occupies
  cells: [],
  
  // length of the snake. grows when eating an apple
  maxCells:

最低0.47元/天解锁文章

马克图布No1

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
HTML游戏之贪吃蛇

HTML游戏之贪吃蛇Snake，代码来自github作者Steven Lambert<!DOCTYPE html><html><head> <title></title> <style> html, body { height: 100%; margin: 0; } body { ...
复制链接

扫一扫

专栏目录