游戏进行页面展示

GAME  OVER 页面展示

 代码如下：

<!doctype html>
<html>
 
<body>
 
<canvas id="can" width="400" height="400" style="background: Black"></canvas>
 
<script>
 
var sn = [42, 41],
dz = 43,
fx = 1,
n, ctx = document.getElementById("can").getContext("2d");
function draw(t, c) {
ctx.fillStyle = c;
ctx.fillRect(t % 20 * 20 + 1, ~~(t / 20) * 20 + 1, 18, 18);
}
document.onkeydown = function(e) {
fx = sn[1] - sn[0] == (n = [-1, -20, 1, 20][(e || event).keyCode - 37] || fx) ? fx : n
};
! function() {
sn.unshift(n = sn[0] + fx);
if (sn.indexOf(n, 1) > 0 || n < 0 || n > 399 || fx == 1 && n % 20 == 0 || fx == -1 && n % 20 == 19)
return alert("GAME OVER");
draw(n, "Lime");
if (n == dz) {
while (sn.indexOf(dz = ~~(Math.random() * 400)) >= 0);
draw(dz, "Yellow");
} else
draw(sn.pop(), "Black");
setTimeout(arguments.callee, 130);
}();
 
</script>
 
</body>
</html>

用最少的JS代码写出贪吃蛇游戏---迷你版的更多相关文章

  1. Python写的贪吃蛇游戏例子

    第一次用Python写这种比较实用且好玩的东西,权当练手吧 游戏说明: * P键控制“暂停/开始”* 方向键控制贪吃蛇的方向 源代码如下: 复制代码代码如下: from Tkinter import ...

  2. 关于用Java写的贪吃蛇游戏的一些感想

    学习Java有那么一个月了,兴趣还是挺高的.然而最近老师布置的一个迷宫问题,着实让我头疼了一两个礼拜,以至于身心疲惫,困扰不安.无奈,暂且先放下这个迷宫问题,写个简单点的贪吃蛇程序,以此来提高低落的情 ...

  3. js编写简单的贪吃蛇游戏

    css代码 *{ margin:; padding:; } td{ width: 4px; height: 4px; background: #ccc; border: 2px solid #ccc; ...

  4. 同事上班时间无聊，用python敲出贪吃蛇游戏打发时间

    自从学会啦python,再也不用担心上班时间老板发现我打游戏啦 贪吃蛇代码: 还有不懂的(https://www.ixigua.com/i6808019824560570888/)这里有视频教程. 如 ...

  5. python 写一个贪吃蛇游戏

    #!usr/bin/python #-*- coding:utf-8 -*- import random import curses s = curses.initscr() curses.curs_ ...

  6. 程序员面试京东前端，现场JavaScript代码写出魔方特效

    程序员面试京东前端,现场JS代码写出魔方特效,成功搞定20K月薪 今天小编我逛论坛,看到了一位程序员小伙子,因为是有了两年工作经验,然后去京东面试前端岗,一面二面轻松就过了,到了技术面这一块,小伙干脆 ...

  7. 用OpenGL简单编写的一个最简单贪吃蛇游戏

    刚学OpenGL的时候,写的一个最简单的贪吃蛇游戏代码 如下: //贪吃蛇游戏 #include<stdio.h> #include<stdlib.h> #include< ...

  8. 用C++实现的贪吃蛇游戏

    我是一个C++初学者,控制台实现了一个贪吃蛇游戏. 代码如下: //"贪吃蛇游戏"V1.0 //李国良于2016年12月29日编写完成 #include <iostream& ...

  9. JS函数 编程练习 使用javascript代码写出一个函数：实现传入两个整数后弹出较大的整数。

    编程练习 使用javascript代码写出一个函数:实现传入两个整数后弹出较大的整数. 任务 第一步: 编写代码完成一个函数的定义吧. 第二步: 我们来补充函数体中的控制语句,完成函数功能吧. 提示: ...

随机推荐

  1. PCB Layout初学者必会知识总结（转）

    PCB是印刷电路板(即Printed Circuit Board)的简称.印刷电路板是组装电子零件用的基板,是在通用基材上按预定设计形成点间连接及印制元件的印制板.该产品的主要功能是使各种电子零组件形 ...

  2. manage.py migrate 报错

    第一个提示,setting里面的 STATICFILES_DIRS = (  os.path.join(BASE_DIR,'static')) 第二行的后面加','解决,这样可以被识别是tuple. ...

  3. c语言数组类型默认值（c99）

    #include <stdio.h> #include <stdlib.h> int main() { ] = {}; //每个值默认0 ; i < len; i ++) ...

  4. What happens when you type an URL in the browser and press enter?

    What happens when you type an URL in the browser and press enter? 1. You type maps.google.com into t ...

  5. [SOME_MUTATION] (state) {// mutate state}Vuex中使用 ES2015 风格的计算属性命名功能来使用一个常量作为函数名

    使用常量替代 Mutation 事件类型 使用常量替代 mutation 事件类型在各种 Flux 实现中是很常见的模式.这样可以使 linter 之类的工具发挥作用,同时把这些常量放在单独的文件中可 ...

  6. 自动化运维：（1）认识 Shell

    目录 (一)运维是什么? (二)什么是 Shell? (三)Shell的分类 (四)Shell脚本 (五)Shell的变量 (六)表达式 (七)Linux常见符号 (八)常见命令 (一)自动化运维是什 ...

  7. 如果Mysql插入字符始终乱码怎么办？

    1.找到my.cnf [root@Sliver-Code ~]# vi /etc/my.cnf 加入下面三行语句 [client] default-character-set=utf8 [mysqld ...

  8. 安装多个版本的TensorFlow

    TensorFlow 2.0测试版在今年春季发布,新版本比1.x版本在易用性上有了很大的提升.但是由于2.0发布还没有多久,现在大部分论文的实现代码都是1.x版本的,所以在学习TensorFlow的过 ...

  9. day32 网络编程之粘包问题

    1.最大半连接数 什么是最大半连接数 半连接:在进行TCP协议通信时,客户端与服务器端进行三次握手建立连接,但是有时客户端与服务器端进行了连接申请,服务器端也同意了申请(既已经完成三次握手的两次),此 ...

  10. Linux下kafka集群搭建过程记录

    环境准备 zookeeper集群环境kafka是依赖于zookeeper注册中心的一款分布式消息对列,所以需要有zookeeper单机或者集群环境. 三台服务器: 172.16.18.198 k8s- ...