js贪食蛇
<!DOCTYPE html>
<head>
<title>canvas贪食蛇</title>
<style>
.canvas{
background:black;
}
</style>
</head>
<body>
<canvas class="canvas" id="canvas" width='400' height='400'></canvas>
<script>
var sn=[42,41], dz=43, fx=1, n, ctx=document.getElementById('canvas').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]-[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 ;
draw(n,'red');
if(n==dz){
while(sn.indexOf(dz=~~(Math.random()*400))>=0);
draw(dz,'red');
}else
draw(sn.pop(),'Black');
setTimeout(arguments.callee,130);
}();
</script>
</body>
</html>
js贪食蛇的更多相关文章
- Javascript贪食蛇小游戏
试玩:http://hovertree.com/game/9/ 贪吃蛇是一种风靡全球的小游戏,就是一条小蛇,不停地在屏幕上游走,吃各个方向出现的蛋,越吃越长.只要蛇头碰到屏幕四周,或者碰到自己的身子, ...
- 一起来做webgame,《Javascript贪食蛇》
2019-09-22更新: 使用canvas实现:https://github.com/onlyfu/SnakeSir-Javascript 以下为HTML4实现: 今天来个略有意思的,<贪食蛇 ...
- canvas游戏之贪食蛇
直接上效果图: 这个贪食蛇关键地方在于数组,它的长度增加其实是数组的增长,就是数组的向前追加等操作,核心就是数组的操作. 完整代码: <!DOCTYPE html> <html> ...
- JavaScript强化教程 - 六步实现贪食蛇
1.首先创建div 并且给div加样式 <div id="pannel" style="width: 500px;height: 500px;z-index: 1; ...
- OS X下开发!ios系统贪食蛇!——from cocos2d-x 3.0
前几天用cocos2d-x写了个贪食蛇!这次是全然在osx下开发的.基本的思路是这种我建立了一个Snake类,当中有两个构造函数一个是用于存放蛇身体sprite的图片和Snake的X坐标和Y坐标.另外 ...
- 【原创】只学到二维数组和结构体,不用链表也能写一个C贪食蛇?(四)
全系列Index: [原创]只学到二维数组和结构体,不用链表也能写一个C贪食蛇?(一) [原创]只学到二维数组和结构体,不用链表也能写一个C贪食蛇?(二) [原创]只学到二维数组和结构体,不用链表也能 ...
- Cocos2dx 3.0 过渡篇(二十五)死不了的贪食蛇(触摸版)
上一篇写的贪食蛇的重力感应控制版,这一篇就讲下触摸控制版吧.额,也不知道写了那个贪食蛇教程究竟有没有获得沈老师的书,假设没有的话,看我不拿西瓜刀砍掉 偶尔E往事 的那啥! 重力版链接:http://b ...
- JavaScript贪食蛇游戏制作详解
之前闲时开发过一个简单的网页版贪食蛇游戏程序,现在把程序的实现思路写下来,供有兴趣同学参考阅读. 代码的实现比较简单,整个程序由三个类,一组常量和一些游戏逻辑以外的初始化和控制代码组成,总共400多行 ...
- c++实现贪食蛇
今天老师布置了作业 让我们观察c++实现贪食蛇的代码 #include<windows.h> #include<time.h> #include<stdlib.h> ...
随机推荐
- nodejs post 数据到php $_POST["content"]接收不到的问题
今天写了一段代码,要用到ajax调用php的接口,因为是https的,所以ajax不能跨域,于是使用nodejs调用接口,但是传输数据后 $_POST["content"]接收不到 ...
- vim多行注释与删除
一.多行注释 1. 首先按esc进入命令行模式下,按下Ctrl + v,进入列(也叫区块)模式;2. 在行首使用上下键选择需要注释的多行;3. 按下键盘(大写)“I”键,进入插入模式:4. 然后输入注 ...
- django基础知识之Response对象
HttpResponse对象 在django.http模块中定义了HttpResponse对象的API HttpRequest对象由Django自动创建,HttpResponse对象由程序员创建 不调 ...
- vi vim 查找替换
#查找# / 光标向下查找 ?光标向上查找 按键盘n,继续查找 #替换# :s/hello/test/ 替换光标所在行第一个hello为test :s/hello/test/g 替换光标所在行所有h ...
- C#.net地址传参汉字乱码解决方案
C#.net地址传参汉字乱码解决方案 web.config文件: <system.web> <globalization requestEncoding="GB2312 ...
- leetcode 75 Sort Colors 计数排序,三路快排
解法一:计数排序:统计0,1,2 的个数 时间复杂度:O(n) 空间复杂度:O(k) k为元素的取值范围, 此题为O(1) class Solution { public: void sortC ...
- python-global全局变量
在函数内部定义变量时,他们与函数外部具有相同名称的其他变量没有任何关系,即变量名称对于函数来说是局部的,这称为变量的作用域,示例如下: def func_local(x): print 'x is', ...
- Spring中如何向 Bean注入系统属性或环境变量
[转自] http://unmi.cc/spring-injection-system-properties-env/ 在 Spring 中为 javabean 注入属性文件中的属性值一般人都知道的, ...
- pyspider的基本操作
一.安装 pip install pyspider 1.修改 pyspider/webui/webdav.py 第209行:否则启动会报错 把: 'domaincontroller': NeedAut ...
- nginx 地址重写
例如, www.baidu.com 跳到 www.baidu.com/index.html #if ( $http_host ~* "^(.*)\.baidu\.com$" ...