帮助中心
获取牛币
联系我们
关于我们
版权声明
素材牛首页
微博登录
QQ登录
微信扫码登录
注册
登录
新浪微博
QQ登陆
微信登录
热门搜索:
小程序
支付
Java
后台模板
上传
商城模板
jQuery
手机
Thinkphp
微信
Vue.js
首 页
网页特效
整站源码
PHP实例
网站模版
工具箱
常用代码
论坛
游戏源码
资源分享
当前位置:
首页
»
精选常用代码
» 二十行代码做贪吃蛇
二十行代码做贪吃蛇
浏览:1432次
-
评论:1次
-
发布时间:2018-01-11
Html
Css
Js
Your browser does not support the HTML5 canvas tag.
var ctx = document.getElementById("myCanvas").getContext("2d"), r = [{ x: 10, y: 9 }, { x: 10, y: 8 }], co = 40, e = null; ctx.shadowBlur = 20, ctx.shadowColor = "black"; setInterval(function() { if (check(r[0], 0) || r[0].x < 0 || r[0].x >= 24 || r[0].y < 0 || r[0].y >= 24) return; e != null && ((co == 40 && r[0].x == e.x && r[0].y + 1 == e.y) || (co == 38 && r[0].x == e.x && r[0].y - 1 == e.y) || (co == 37 && r[0].x - 1 == e.x && r[0].y == e.y) || (co == 39 && r[0].x + 1 == e.x && r[0].y == e.y)) ? (r.unshift(e), e = null, r.unshift(r.pop())) : (r.unshift(r.pop())); (co == 40 || co == 38) ? (r[0].x = r[1].x, r[0].y = r[1].y + (co == 40 ? 1 : -1)) : (r[0].x = r[1].x + (co == 39 ? 1 : -1), r[0].y = r[1].y); ctx.clearRect(0, 0, 240, 240); if (e) ctx.fillRect(e.x * 10, e.y * 10, 10, 10); for (var i = 0; i < r.length; i++) ctx.fillRect(r[i].x * 10, r[i].y * 10, 10, 10); while (e == null || check(e)) e = { y: (Math.random() * 24 >>> 0), x: (Math.random() * 24 >>> 0) }; if (check(r[0], 0) || r[0].x < 0 || r[0].x >= 24 || r[0].y < 0 || r[0].y >= 24) alert("game over\nYou get [" + (r.length - 2) + "]"); }, 100); document.onkeyup = function(event) { co = event.keyCode >= 37 && event.keyCode <= 40 && (Math.abs(event.keyCode - co) != 2) ? event.keyCode : co; } function check(e, j) { for (var i = 0; i < r.length; i++) if (j != i && r[i].x == e.x && r[i].y == e.y) return true; return false; }
↑上面代码改变,会自动显示代码结果
jQuery调用版本:
1.11.3
<!doctype html><html><head><meta charset="utf-8"><title>二十行代码做贪吃蛇-www.sucainiu.com</title><script src="https://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script><style>
</style></head><body>
<script>
</script>
</body></html>
立即下载
收藏
积分说明:注册即送10牛币,每日签到可获得5牛币,成为VIP会员可永久免牛币下载!
充值积分
充值会员
更多说明»
代码描述:一个贪吃蛇小游戏的代码
纯CSS3绘制正六边形凤巢效果可自定义投影
多图片上传预览效果
讨论这个常用代码(1)
回答他人问题或分享心得会奖励牛币
Lv10 CTO
华***n
2018年01月12日
可以 感谢分享
回复
文明上网,理性发言! 😉 阿里云幸运券,
戳我领取
发表评论
提交回复
我的积分余额:
0
已下载次数:
1432
所需牛币:
5
开始下载
牛币获取:
签到、评论、充值
» 在线充值
(10牛币=1元)
成为VIP可永久免积分下载全部常用代码
» 查看详情
VIP
客服
签到
充值