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

No:6671

126

←

Prev Next

→

Make an AI game
Developer User3913｜Date and time 23/7/3 2:58:57
Build time 30.149 sec｜Game capacity 3.516KB｜

Script

Sure! Here's a simple AI game implemented as a single HTML file using JavaScript. The game depicts a rock-paper-scissors game where the player can compete against the computer.

Rock-Paper-Scissors

To play the game, save the above code in a file with a `.html` extension (e.g., `ai_game.html`) and open it in a web browser. The game will display three buttons for the player to choose from: Rock, Paper, and Scissors. When the player clicks a button, the game will randomly generate the computer's choice and display both choices as pictograms. The result of the game (win, loss, or tie) will be shown below the choices. Note: You need to replace the `emozi_all/rock.png`, `emozi_chicken.png`, and `emozi_all/scissors.png` paths with the actual paths to your pictogram images or use appropriate image references if you decide not to use pictograms.

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

Sure! Here's a simple AI game implemented as a single HTML file using JavaScript. The game depicts a rock-paper-scissors game where the player can compete against the computer.

```html
<!DOCTYPE html>
<html>
<head>
    <style>
        body {
            text-align: center;
            font-family: Arial, sans-serif;
            margin-top: 50px;
        }
        h1 {
            font-size: 24px;
        }
        img {
            width: 150px;
            height: 150px;
            margin: 10px;
        }
        button {
            background-color: #4CAF50;
            border: none;
            color: white;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 10px;
            cursor: pointer;
        }
        #result {
            font-size: 20px;
            font-weight: bold;
            margin-top: 20px;
        }
    </style>
</head>
<body>
    <h1>Rock-Paper-Scissors</h1>
    <img id="playerChoice" src="" alt="Player's choice">
    <img id="computerChoice" src="" alt="Computer's choice">
    <p>
        <button onclick="playGame('rock')">Rock</button>
        <button onclick="playGame('paper')">Paper</button>
        <button onclick="playGame('scissors')">Scissors</button>
    </p>
    <p id="result"></p>
    
    <script>
        function playGame(playerChoice) {
            const choices = ['rock', 'paper', 'scissors'];
            const computerChoice = choices[Math.floor(Math.random() * choices.length)];
            
            document.getElementById('playerChoice').src = getChoiceImage(playerChoice);
            document.getElementById('computerChoice').src = getChoiceImage(computerChoice);
            
            if (playerChoice === computerChoice) {
                document.getElementById('result').innerHTML = "It's a tie!";
            } else if (
                (playerChoice === 'rock' && computerChoice === 'scissors') ||
                (playerChoice === 'paper' && computerChoice === 'rock') ||
                (playerChoice === 'scissors' && computerChoice === 'paper')
            ) {
                document.getElementById('result').innerHTML = "Congratulations! You win!";
            } else {
                document.getElementById('result').innerHTML = "Oh no! You lose!";
            }
        }
        
        function getChoiceImage(choice) {
            if (choice === 'rock') {
                return 'rock.png'; // Replace with your rock pictogram image path
            } else if (choice === 'paper') {
                return 'paper.png'; // Replace with your paper pictogram image path
            } else if (choice === 'scissors') {
                return 'scissors.png'; // Replace with your scissors pictogram image path
            }
        }
    </script>
</body>
</html>
```

Note: You need to replace the `rock.png`, `paper.png`, and `scissors.png` paths with the actual paths to your pictogram images or use appropriate image references if you decide not to use pictograms.