游戏进行页面展示

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. docker内时间问题

    修改配置文件来修改时区1.修改/etc/sysconfig/clock         ZONE=Asia/Shanghai 2.rm /etc/localtime 3.链接到上海时区文件       ...

  2. 错误代码 2003不能连接到MySQL服务器在*.*.*.*(10061)

    错误代码 2003不能连接到MySQL服务器在*.*.*.*(10061) 错误代码 2003不能连接到MySQL服务器在*.*.*.*(10061)哪位大侠知道怎么解决啊? 在线等!!! [[i] ...

  3. Vue UI组件 开发框架 服务端 辅助工具 应用实例 Demo示例

    Vue UI组件 开发框架 服务端 辅助工具 应用实例 Demo示例 element ★11612 - 饿了么出品的Vue2的web UI工具套件 Vux ★7503 - 基于Vue和WeUI的组件库 ...

  4. 浏览器输入url后发生的事情以及每步可以做的优化

    首先总结下输入url按下回车后的大致流程: 查询url的ip地址. 建立tcp连接,连接服务器. 浏览器发起http/https请求. 服务器响应浏览器的请求. 网页的解析与渲染. 下面分析每个过程 ...

  5. SpringMVC中实现Bean Validation(JSR 303 JSR 349 JSR 380)

    JSR 303是针对bean数据校验提出的一个规范.使用注解方式实现数据校验. 每个注解的用法这里就不多介绍,请移步JSR 303 - Bean Validation 介绍及最佳实践 笔者上面提到的J ...

  6. Elasticsearch常见错误与配置简介

    一.常见错误 1.1 root用户启动elasticsearch报错 Elasticsearch为了安全考虑,不让使用root启动,解决方法新建一个用户,用此用户进行相关的操作.如果你用root启动, ...

  7. JAVA 面向对象编程 --自我总结

    子系统 系统结构是指由系统多个子系统组成,以及子系统由多个更小的子系统组成的结构.那么子系统又具备哪些特点呢? 特点: 1.结构的稳定性 :软件在设计阶段,在把一个系统划分成更小的子系统时,设计合理, ...

  8. 【HTML】常用的标签学习

    HTML(HyperText Markup Language )又称超文本标记语言,与一般文本文件不同的是它是由各种标签或标记组成 <标签名></标签名> .所以html的学习 ...

  9. 一个提高照片质量的网站和一个改变照片DPI的方法

    相信很多童鞋都有遇到过,碰到一张很喜欢的图片,想用来做背景什么的,蛋似--因为画质太AV了怕引起误会,所以不敢使用!很气--!! 这时大神就会跳出来说,画质不好?PS是用来吃si的么! 我:我才不会用 ...

  10. C#中Math方法总结

    名称  说明      E  表示自然对数的底,它由常数 e 指定.    PI  表示圆的周长与其直径的比值,它通过常数 π 指定. Abs  已重载.返回指定数字的绝对值.      Acos   ...