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

No:40705

←

Prev Next

→

棒人間を分身させるゲーム
Developer User18220｜Date and time 24/2/3 23:33:50
Build time 7.369 sec｜Game capacity 2.209KB｜

Script

了解です。以下に棒人間を分身させるゲームの実装例を示します。

分身ゲーム

このプログラムでは、指定したサイズのボード上で棒人間を分身させるシンプルなゲームが実装されています。ボード上をクリックすると棒人間が分身し、次々に増えていきます。

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

了解です。以下に棒人間を分身させるゲームの実装例を示します。

```html
<!DOCTYPE html>
<html>
<head>
    <title>分身ゲーム</title>
    <meta charset="utf-8">
    <style>
        #board {
            position: relative;
            width: 400px;
            height: 400px;
            background-color: #f1f1f1;
        }
        .person {
            position: absolute;
            width: 20px;
            height: 20px;
            background-color: #000;
            border-radius: 50%;
        }
    </style>
</head>
<body>
    <h1>分身ゲーム</h1>
    <div id="board"></div>

// 初期位置に棒人間を配置する
        function initializePerson() {
            const person = document.createElement('div');
            person.className = 'person';
            person.style.left = '190px'; // 初期X座標
            person.style.top = '190px'; // 初期Y座標
            board.appendChild(person);
            persons.push(person);
        }

// 分身を生成する
        function duplicatePerson() {
            const newPerson = document.createElement('div');
            newPerson.className = 'person';
            const person = persons[persons.length - 1];
            const posX = parseInt(person.style.left, 10) + 30;
            const posY = parseInt(person.style.top, 10) + 30;
            newPerson.style.left = posX + 'px';
            newPerson.style.top = posY + 'px';
            board.appendChild(newPerson);
            persons.push(newPerson);
        }

// 画面をタップした時に分身する
        board.addEventListener('click', duplicatePerson);

// 分身ゲームを開始する
        function startGame() {
            initializePerson();
        }

// ゲームを開始する
        startGame();
    </script>
</body>
</html>
```