WEBLEB
Início
Editor
Entrar
Pro
Português
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Jogo da cobra
1687
Anes_unk
Abrir no Editor
Video
Publique Seu Código
0
Recomendado
27 June 2025
código de dança
19 January 2026
Reprodutor de jogos em Flash com emulador Ruffle
16 January 2026
Jogo HTML5 "Friday Night Funkin' Vs Nonsense"
HTML
Copy
Snake Game - Realistic
Score: 0
Game Over! Press F5 to Restart
CSS
Copy
* { margin: 0; padding: 0; box-sizing: border-box; } body { background-color: #000; display: flex; justify-content: center; align-items: center; height: 100vh; font-family: 'Arial', sans-serif; color: white; } canvas { border: 2px solid white; background-color: #222; } .score { position: absolute; top: 20px; left: 20px; font-size: 20px; color: white; } .game-over { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 2rem; color: white; display: none; }
JS
Copy
const canvas = document.getElementById('gameCanvas'); const ctx = canvas.getContext('2d'); canvas.width = 500; canvas.height = 500; const blockSize = 20; let speed = 100; let snake = [ { x: 240, y: 240 }, { x: 220, y: 240 }, { x: 200, y: 240 } ]; let direction = 'RIGHT'; let food = generateFood(); let score = 0; let gameOver = false; function moveSnake() { const head = { ...snake[0] }; if (direction === 'UP') head.y -= blockSize; if (direction === 'DOWN') head.y += blockSize; if (direction === 'LEFT') head.x -= blockSize; if (direction === 'RIGHT') head.x += blockSize; snake.unshift(head); if (head.x === food.x && head.y === food.y) { score += 10; food = generateFood(); updateScore(); if (score % 50 === 0) { speed -= 10; } } else { snake.pop(); } } function generateFood() { let x = Math.floor(Math.random() * (canvas.width / blockSize)) * blockSize; let y = Math.floor(Math.random() * (canvas.height / blockSize)) * blockSize; return { x, y }; } function drawSnake() { ctx.fillStyle = 'green'; snake.forEach((segment, index) => { if (index === 0) { ctx.fillStyle = 'darkgreen'; } else { ctx.fillStyle = 'green'; } ctx.fillRect(segment.x, segment.y, blockSize, blockSize); }); } function drawFood() { ctx.fillStyle = 'red'; ctx.fillRect(food.x, food.y, blockSize, blockSize); } function checkCollisions() { const head = snake[0]; if (head.x < 0 || head.x >= canvas.width || head.y < 0 || head.y >= canvas.height) { gameOver = true; } for (let i = 1; i < snake.length; i++) { if (head.x === snake[i].x && head.y === snake[i].y) { gameOver = true; } } } function updateScore() { document.getElementById('scoreDisplay').innerText = `Score: ${score}`; } function draw() { ctx.clearRect(0, 0, canvas.width, canvas.height); drawSnake(); drawFood(); } function gameLoop() { if (gameOver) return showGameOver(); moveSnake(); checkCollisions(); draw(); } function showGameOver() { document.getElementById('gameOverText').style.display = 'block'; } document.addEventListener('keydown', (e) => { if (e.code === 'ArrowUp' && direction !== 'DOWN') { direction = 'UP'; } else if (e.code === 'ArrowDown' && direction !== 'UP') { direction = 'DOWN'; } else if (e.code === 'ArrowLeft' && direction !== 'RIGHT') { direction = 'LEFT'; } else if (e.code === 'ArrowRight' && direction !== 'LEFT') { direction = 'RIGHT'; } }); setInterval(gameLoop, speed);