AI game creator

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

No:4767

1948

←

Prev Next

→

manjuu
Developer もちきなこ｜Date and time 23/6/28 19:27:19
Build time 22.312 sec｜Game capacity 2.438KB｜

Script

わかりました、まんじゅうこわいというゲームを作ります。以下が実装例です。

このプログラムは「まんじゅうこわい」というゲームで、画面上に表示されるまんじゅう（🍘絵文字）をクリックすることで、まんじゅうが動き回ります。まんじゅうをクリックすると、まんじゅうがびっくりした表情（😱絵文字）に変わります。スマホで操作することを前提としていますが、PCブラウザでも実行できます。ただし、画面サイズによってはまんじゅうが画面外に移動することがあります。

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

わかりました、まんじゅうこわいというゲームを作ります。以下が実装例です。

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>まんじゅうこわい</title>
</head>
<body>
    <script>
        const manjuEmoji = '🍘';
        const scaredEmoji = '😱';

const screenWidth = window.innerWidth;
        const screenHeight = window.innerHeight;

let manjuX = Math.random() * screenWidth;
        let manjuY = Math.random() * screenHeight;

const manjuElement = document.createElement('span');
        manjuElement.innerText = manjuEmoji;
        manjuElement.style.position = 'absolute';
        manjuElement.style.top = manjuY + 'px';
        manjuElement.style.left = manjuX + 'px';
        document.body.appendChild(manjuElement);

function moveManju() {
            const newX = Math.random() * screenWidth;
            const newY = Math.random() * screenHeight;
            manjuElement.style.top = newY + 'px';
            manjuElement.style.left = newX + 'px';
        }

function scream() {
            manjuElement.innerText = scaredEmoji;
            setTimeout(() => {
                manjuElement.innerText = manjuEmoji;
            }, 2000);
        }

function checkCollision(event) {
            const clickX = event.clientX;
            const clickY = event.clientY;

const manjuLeft = manjuX;
            const manjuRight = manjuX + manjuElement.offsetWidth;
            const manjuTop = manjuY;
            const manjuBottom = manjuY + manjuElement.offsetHeight;

if (clickX >= manjuLeft && clickX <= manjuRight && clickY >= manjuTop && clickY <= manjuBottom) {
                scream();
                moveManju();
            }
        }

document.addEventListener('click', checkCollision);
    </script>
</body>
</html>
```

このプログラムは「まんじゅうこわい」というゲームで、画面上に表示されるまんじゅう（🍘絵文字）をクリックすることで、まんじゅうが動き回ります。まんじゅうをクリックすると、まんじゅうがびっくりした表情（😱絵文字）に変わります。

スマホで操作することを前提としていますが、PCブラウザでも実行できます。ただし、画面サイズによってはまんじゅうが画面外に移動することがあります。