AI game creator

Click here for free DL of the app version that can save data.

No:48273

←

Prev Next

→

Snake Game
Developer User20722｜Date and time 24/3/1 21:01:44
Build time 12.443 sec｜Game capacity 2.301KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Snake Game</title>
<style>
  canvas {
    border: 1px solid black;
  }
</style>
</head>
<body>
<canvas id="gameCanvas" width="400" height="400"></canvas>

document.addEventListener('keydown', direction);

let d;
function direction(event) {
  if(event.keyCode == 37 && d != 'RIGHT') {
    d = 'LEFT';
  } else if(event.keyCode == 38 && d != 'DOWN') {
    d = 'UP';
  } else if(event.keyCode == 39 && d != 'LEFT') {
    d = 'RIGHT';
  } else if(event.keyCode == 40 && d != 'UP') {
    d = 'DOWN';
  }
}

function drawSnake() {
  for(let i = 0; i < snake.length; i++) {
    ctx.fillStyle = (i === 0) ? 'green' : 'white';
    ctx.fillRect(snake[i].x, snake[i].y, box, box);
    ctx.strokeStyle = 'black';
    ctx.strokeRect(snake[i].x, snake[i].y, box, box);
  }
}

function drawFood() {
  ctx.fillStyle = 'red';
  ctx.fillRect(food.x, food.y, box, box);
}

function draw() {
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  drawSnake();
  drawFood();
  moveSnake();
  checkCollision();
}

let game = setInterval(draw, 100);

</script>
</body>
</html>