tangloong的gravatar头像
tangloong2016-03-23 10:28:28

js开发实现简单贪吃蛇游戏(20行代码)

曾经诺基亚的贪吃蛇风靡一时,在游戏匮乏的年代,用java实现太难,现在网页制作20行代码就做成一个简单的demo了,时代在进步啊

代码:

<!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开发实现简单贪吃蛇游戏(20行代码)

这是游戏结束:

js开发实现简单贪吃蛇游戏(20行代码)

gif动图


打赏

文件名:snakeat.zip,文件大小:0.599K下载
  • /
    • /snakeat.html
最代码最近下载分享源代码列表最近下载
一支沉香4月20日
暂无贡献等级
lipiao12114月12日
暂无贡献等级
jic4993月19日
暂无贡献等级
罗绍成3月14日
暂无贡献等级
huangxiaolong2月24日
暂无贡献等级
23791139232月10日
暂无贡献等级
wqc66661月22日
暂无贡献等级
tianlin19952017年12月6日
暂无贡献等级
最代码官方 LV42017年11月17日
最代码贡献等级说明
11839375552017年11月16日
暂无贡献等级
最代码最近浏览分享源代码列表最近浏览
lixinwei1325分钟前
暂无贡献等级
暂无贡献等级
JokerLccc4月20日
最代码贡献等级说明
llb04204月19日
暂无贡献等级
pengboss4月19日
最代码贡献等级说明
simpleasong4月19日
暂无贡献等级
50565584月19日
暂无贡献等级
8612332694月18日
暂无贡献等级
一支沉香4月18日
暂无贡献等级
rookiei4月17日
暂无贡献等级
顶部客服微信二维码底部
>扫描二维码关注最代码为好友扫描二维码关注最代码为好友