<!DOCTYPE html> <html> <head> <title>Snake Game</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <style> canvas { border: 1px solid black; } </style> </head> <body> <canvas id="canvas" width="400" height="400"></canvas> <script> const canvas = document.getElementById("canvas"); const ctx = canvas.getContext("2d"); const cellSize = 10; let snake = [{x: 5, y: 5}]; let direction = "right"; let food = {x: 10, y: 10}; let score = 0; function drawSnake() { ctx.fillStyle = "green"; snake.forEach(function(cell) { ctx.fillRect(cell.x * cellSize, cell.y * cellSize, cellSize, cellSize); }); } function moveSnake() { let head = snake[0]; if (direction === "right") { snake.unshift({x: head.x + 1, y: head.y}); } else if (direction === "left") { snake.unshift({x: head.x - 1, y: head.y}); } else if (direction === "up") { snake.unshift({x: head.x, y: head.y - 1}); } else if (direction === "down") { snake.unshift({x: head.x, y: head.y + 1}); } if (snake[0].x === food.x && snake[0].y === food.y) { food = { x: Math.floor(Math.random() * (canvas.width / cellSize)), y: Math.floor(Math.random() * (canvas.height / cellSize)) }; score++; } else { snake.pop(); } } function drawFood() { ctx.fillStyle = "red"; ctx.fillRect(food.x * cellSize, food.y * cellSize, cellSize, cellSize); } function drawScore() { ctx.fillStyle = "black"; ctx.font = "20px Arial"; ctx.fillText(`Score: ${score}`, 10, canvas.height - 10); } function update() { ctx.clearRect(0, 0, canvas.width, canvas.height); drawSnake(); moveSnake(); drawFood(); drawScore(); } function handleKeyDown(event) { if (event.key === "ArrowRight" && direction !== "left") { direction = "right"; } else if (event.key === "ArrowLeft" && direction !== "right") { direction = "left"; } else if (event.key === "ArrowUp" && direction !== "down") { direction = "up"; } else if (event.key === "ArrowDown" && direction !== "up") { direction = "down"; } } setInterval(update, 100); document.addEventListener("keydown", handleKeyDown); </script> </body> </html>

Inscription #634224

ID

f6c2e39dc3...b8278176i0

Detail

History

Action
Price
Marketplace
From
To
Time

TRANSFER

-

-

lk536a7p

about 1 year

INSCRIBED

-

-

-lk53

over 1 year

Sign Up for our Newsletter

And be the first to know about any updates!

OrdinalHub logo

All Rights Reserved OrdinalHub.com 2024

Support

Follow Us