AI game creator

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

No:37486

←

Prev Next

→

snake
Developer User17003｜Date and time 24/1/21 4:24:52
Build time 12.666 sec｜Game capacity 4.612KB｜

Script

Sure, here is an example of a simple Snake game implemented as a single HTML file using JavaScript:

This implementation creates a snake game in a 20x20 grid (400x400 pixels). The snake moves and the player controls its direction using the arrow keys. The goal is to eat the red food items that appear randomly on the board without hitting the boundaries or the snake itself. If the game is over, an alert message will be displayed. Please note that this is a basic example and can be further enhanced with additional features and improvements based on your specific requirements.

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

Sure, here is an example of a simple Snake game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <style>
        #game-board {
            height: 400px;
            width: 400px;
            margin: 0 auto;
            border: 1px solid black;
            position: relative;
        }

.snake-part {
            height: 20px;
            width: 20px;
            position: absolute;
            background-color: green;
        }

#food {
            height: 20px;
            width: 20px;
            position: absolute;
            background-color: red;
        }
    </style>
</head>
<body>
    <div id="game-board"></div>

// Function to generate random food position
            function generateFoodPosition() {
                const x = Math.floor(Math.random() * boardSize);
                const y = Math.floor(Math.random() * boardSize);
                return { x, y };
            }

// Function to draw the snake on the board
            function drawSnake() {
                board.innerHTML = '';
                snake.forEach(snakePart => {
                    const snakePartElement = document.createElement('div');
                    snakePartElement.className = 'snake-part';
                    snakePartElement.style.top = (snakePart.y * 20) + 'px';
                    snakePartElement.style.left = (snakePart.x * 20) + 'px';
                    board.appendChild(snakePartElement);
                });
            }

// Function to draw food on the board
            function drawFood() {
                const foodElement = document.createElement('div');
                foodElement.id = 'food';
                foodElement.style.top = (food.y * 20) + 'px';
                foodElement.style.left = (food.x * 20) + 'px';
                board.appendChild(foodElement);
            }

// Function to handle snake movement
            function moveSnake() {
                const head = { ...snake[0] };
                if (direction === 'up') head.y--;
                if (direction === 'down') head.y++;
                if (direction === 'left') head.x--;
                if (direction === 'right') head.x++;

snake.unshift(head);

if (head.x === food.x && head.y === food.y) {
                    food = generateFoodPosition();
                } else {
                    snake.pop();
                }
            }

// Function to check game over condition
            function checkGameOver() {
                const head = snake[0];
                if (
                    head.x < 0 || head.x >= boardSize ||
                    head.y < 0 || head.y >= boardSize ||
                    snake.slice(1).some(snakePart => snakePart.x === head.x && snakePart.y === head.y)
                ) {
                    clearInterval(gameInterval);
                    alert('Game Over!');
                }
            }

let direction = 'right'; // Initial snake direction

// Handle user key presses to change snake direction
            document.addEventListener('keydown', event => {
                if (event.key === 'ArrowUp' && direction !== 'down') direction = 'up';
                if (event.key === 'ArrowDown' && direction !== 'up') direction = 'down';
                if (event.key === 'ArrowLeft' && direction !== 'right') direction = 'left';
                if (event.key === 'ArrowRight' && direction !== 'left') direction = 'right';
            });

// Start the game
            const gameInterval = setInterval(() => {
                moveSnake();
                checkGameOver();
                drawSnake();
                drawFood();
            }, 200);
        });
    </script>
</body>
</html>
```

Please note that this is a basic example and can be further enhanced with additional features and improvements based on your specific requirements.