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

No:8742

←

Prev Next

→

RPG style game
Developer User4236｜Date and time 23/7/18 3:26:11
Build time 37.92 sec｜Game capacity 4.373KB｜

Script

RPG Game

Bem-vindo ao mundo do RPG!

Você é um bravo guerreiro pronto para embarcar em uma jornada épica!

←

Prev　Next

→ 　

Back　

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

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

<html>
<head>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
            background-color: #f0f0f0;
        }

h1 {
            color: #333333;
        }
        
        p {
          margin: 10px 0;
        }

.button {
            padding: 10px 20px;
            background-color: #4CAF50;
            color: #fff;
            font-size: 16px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }

.button:hover {
            background-color: #45a049;
        }

#game-container {
            display: none;
            margin-top: 40px;
        }

#character-image {
            width: 200px;
            height: 200px;
            margin-top: 20px;
        }

#description {
            margin-top: 20px;
        }

#actions-container {
            margin-top: 20px;
        }

.action-button {
            margin-top: 10px;
        }

#result-container {
            margin-top: 20px;
        }

#result-message {
            font-weight: bold;
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <h1>RPG Game</h1>
    
    <div id="start-container">
        <p>Bem-vindo ao mundo do RPG!</p>
        <button class="button" onclick="startGame()">Iniciar</button>
    </div>

<div id="game-container">
        <img id="character-image" src="character.png">
        <p id="description">Você é um bravo guerreiro pronto para embarcar em uma jornada épica!</p>
        <div id="actions-container">
            <button class="action-button" onclick="attack()">Atacar</button>
            <button class="action-button" onclick="defend()">Defender</button>
        </div>

<div id="result-container">
            <p id="result-message"></p>
            <button class="action-button" onclick="continueGame()">Continuar</button>
            <button class="action-button" onclick="endGame()">Sair</button>
        </div>
    </div>

function startGame() {
            startContainer.style.display = 'none';
            gameContainer.style.display = 'block';
            description.textContent = 'Que desafios você enfrentará em sua jornada?';
        }

function attack() {
            var randomNumber = Math.floor(Math.random() * 10) + 1;

if (randomNumber <= 5) {
                resultMessage.textContent = 'Você derrotou o inimigo!';
            } else {
                resultMessage.textContent = 'Você foi derrotado pelo inimigo!';
            }

showResult();
        }

function defend() {
            var randomNumber = Math.floor(Math.random() * 10) + 1;

if (randomNumber <= 7) {
                resultMessage.textContent = 'Você se defendeu do ataque inimigo!';
            } else {
                resultMessage.textContent = 'Você não conseguiu se defender e sofreu dano!';
            }

showResult();
        }

function continueGame() {
            resultMessage.textContent = '';

if (gameContainer.style.display === 'none') {
                startContainer.style.display = 'block';
            }
            else {
                description.textContent = 'Que desafios você enfrentará em sua jornada?';
            }

hideResult();
        }

function endGame() {
            startContainer.style.display = 'block';
            gameContainer.style.display = 'none';
            hideResult();
        }

function showResult() {
            resultMessage.style.display = 'block';
            document.getElementsByClassName('action-button').forEach(function(button) {
                button.style.display = 'none';
            });
        }

function hideResult() {
            resultMessage.style.display = 'none';
            document.getElementsByClassName('action-button').forEach(function(button) {
                button.style.display = 'block';
            });
        }
    </script>
</body>
</html>