ZIP贪吃蛇网页小游戏，有排名 168.54KB

qq_74794797需要积分:7(1积分=1元)

资源文件列表:

贪吃蛇.zip 大约有16个文件
  1. 贪吃蛇/
  2. 贪吃蛇/代码/
  3. 贪吃蛇/代码/eatFruit.mp3 85.98KB
  4. 贪吃蛇/代码/game.html 5.36KB
  5. 贪吃蛇/代码/gameOver.mp3 82.92KB
  6. 贪吃蛇/代码/record.html 4.12KB
  7. 贪吃蛇/代码/为游戏添加音效.html 4.09KB
  8. 贪吃蛇/代码/录入分数.html 1.61KB
  9. 贪吃蛇/代码/显示分数.html 1.14KB
  10. 贪吃蛇/代码/绘制单个果实.html 986B
  11. 贪吃蛇/代码/绘制贪吃蛇.html 1.31KB
  12. 贪吃蛇/代码/网格系统绘制.html 547B
  13. 贪吃蛇/代码/贪吃蛇吃果实.html 3.21KB
  14. 贪吃蛇/代码/贪吃蛇吃自己游戏结束.html 3.57KB
  15. 贪吃蛇/代码/贪吃蛇移动.html 2.05KB
  16. 贪吃蛇/代码/贪吃蛇转向.html 2.75KB

资源介绍:

贪吃蛇网页小游戏，有排名
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <canvas id="snakegame" width="400px" height="400px" style="border:black solid 2px;"></canvas> <h2>分数</h2> <h2 id="sc">0</h2> <button id="rank" onclick="rankPage()">排行榜</button> <audio src="eatFruit.mp3" id="eatFruit"></audio> <audio src="gameOver.mp3" id="gameOver"></audio> <script> var myCanvas = document.getElementById("snakegame"); var context = myCanvas.getContext("2d"); //为键盘按下事件设置事件监听，并指定事件处理函数keyPush() document.addEventListener("keydown",keyPush); //全局变量 //控制setInterval var t; //游戏分数记录 var score; //果实位置 var xFruit; var yFruit; //蛇 var trail; var xHead; var yHead; var snakeLen; //蛇在xy两个方向的移动速度 var vx; var vy; //方向键键盘码 var left = 37; var up = 38; var right = 39; var down = 40; //键盘事件的事件处理函数，通过方向键实现方向的转变 function keyPush(e){ switch(e.keyCode){ case left: if(vx != 1 && vy != 0){ vx=-1;vy=0; } break; case up: if(vx != 0 && vy != 1){ vx=0;vy=-1; } break; case right: if (vx != -1 && vy != 0){ vx=1;vy=0; } break; case down: if (vx != 0 && vy != -1){ vx=0;vy=1; } break; } } //填充单个网格(x,y) function paintCell(x,y){ context.fillRect((x-1)*20+1,(y-1)*20+1,18,18); } //以红色绘制果实 function paintFruit(){ context.fillStyle = "red"; paintCell(xFruit,yFruit); } //随机设定果实位置 function randomFruit(){ xFruit = Math.floor((Math.random()*1000))%20 + 1; yFruit = Math.floor((Math.random()*1000))%20 + 1; paintFruit(); } //以绿色绘制贪吃蛇 function paintSnake(){ context.fillStyle = "lime"; for (var i=0; i<trail.length;i++){ paintCell(trail[i].x, trail[i].y); } } //初始化蛇 function initSnake(){ //初始化游戏分数 score = 0; trail = []; xHead = 10; yHead = 10; vx = 1; vy = 0; snakeLen = 3; for (var i=0;i<snakeLen;i++){ trail.push({x:xHead+i-2,y:yHead}); } randomFruit(); //初始化时，添加果实 paintSnake(); } //清空画布 function refreshCanvas(){ context.clearRect(0,0,myCanvas.width,myCanvas.height); } //移动蛇 function moveSnake(){ //蛇下一时刻的头部坐标 xHead = (vx+xHead+19)%20+1; yHead = (vy+yHead+19)%20+1; //在蛇移动之后检查是否吃到自己 selfEat(); //将新的头部坐标添加入trail trail.push({x:xHead,y:yHead}); //将尾部的坐标移除数组 while (trail.length > snakeLen){ trail.shift(); } //判断是否吃到果实 eatFruit(); //清空画布 refreshCanvas(); //重新绘制蛇 paintSnake(); //重新绘制果实 paintFruit(); } //判断贪吃蛇是否吃了果实 function eatFruit(){ if (xHead == xFruit && yHead == yFruit){ fruitEatingSound(); score += 100; var s = document.getElementById("sc"); s.innerText = score; randomFruit(); snakeGrow(); } } //蛇在吃果实之后变长 function snakeGrow(){ snakeLen++; xHead = (vx+xHead+19)%20+1; yHead = (vy+yHead+19)%20+1; trail.push({x:xHead,y:yHead}); } //蛇在吃到自己之后游戏结束 function selfEat(){ for (var i=0;i<trail.length;i++){ if (xHead == trail[i].x && yHead == trail[i].y){ gameOverSound(); endGame(); } } } function bubbleSort(arr){ var swapped = true; var j=0; var tmp; while (swapped){ swapped = false; j++; for (var i=0;i < arr.length-j;i++){ if (arr[i]>arr[i+1]){ tmp = arr[i]; arr[i] = arr[i+1]; arr[i+1] = tmp; swapped = true; } } } } function endGame(){ clearInterval(t); setTimeout(function(){ alert("Good Game"); var scores = localStorage.getItem("scores"); if (scores){ var rank = JSON.parse(scores); if (rank.length == 10){ if (score < Number(rank[9].score)){ location.reload(); }else{ sessionStorage["score"] = score; document.getElementById("rank").click(); } }else{ sessionStorage["score"] = score; document.getElementById("rank").click(); } }else{ sessionStorage["score"] = score; document.getElementById("rank").click(); } },200); } function fruitEatingSound(){ var fruitSound = document.getElementById("eatFruit"); fruitSound.currentTime = 0; fruitSound.play(); } function gameOverSound(){ var endGameSound = document.getElementById("gameOver"); endGameSound.currentTime = 0; endGameSound.play(); } function rankPage(){ if (sessionStorage["score"]){ location.href = "record.html"; }else{ var c = confirm("查看排行榜将放弃本次游戏"); if (c == true){ location.href = "record.html"; } } } //初始化蛇之后，每隔100毫秒调用moveSnake进行蛇的移动 initSnake(); t = setInterval(moveSnake,200); </script> </body> </html>
100+评论
captcha
    相关资源
    类型标题大小时间
    ZIPMatlab数学建模：离散Hopfield神经网络的联想记忆数字识别代码9.82KB5月前
    ZIPspringboot教师工作量管理系统(代码+数据库+LW)12.25MB5月前
    ZIPspringboot甘肃非物质文化网站的设计与开发(代码+数据库+LW)71.74MB5月前
    ZIPMatlab数学建模：D-S理论与灰色关联结合代码530.24KB5月前
    ZIP使用OpenGL实现天空盒（skybox）21.58MB5月前
    ZIP自贡花麻将客户端整套C# 源码，3叫4叫起胡判断87.84KB5月前
    ZIPcarbondata-apache-carbondata-2.3.0-rc110.42MB5月前
    ZIPBeyond-Compare-onlinedown.zip10.58MB5月前