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

No:5235

6846

←

Prev Next

→

次々に上下の位置はランダムに右から左に飛んできて、襲ってくるイーロンマスク。左側にいるマークザッ..ALL
Developer User3819｜Date and time 23/6/29 20:30:05
Build time 37.939 sec｜Game capacity 4.199KB｜

Script

了解です。以下が実装例です:

イーロンマスクゲーム

スコア: 0

🤓

👦

このコードは、指定した要件に基づいてイーロンマスクゲームを実装しています。ゲームは、イーロンマスクが画面内で右から左に移動し、マークザッカーバーグは上下キーで移動しながら「👍」を発射してイーロンマスクを撃ち落とすことが目標です。プレイヤーはマークザッカーバーグを操作してゲームをプレイすることができます。10体のイーロンマスクを撃ち落とすと、マークザッカーバーグの勝利となり、ゲームがクリアとなります。なお、絵文字の表示や動作は、お使いのブラウザやデバイスによって異なる場合がありますので、ご了承ください。

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

了解です。

以下が実装例です:

```html
<!DOCTYPE html>
<html>
<head>
    <title>イーロンマスクゲーム</title>
    <style>
        #elon {
            position: absolute;
            top: 0;
            right: 100%;
            font-size: 30px;
        }

#zuckerberg {
            position: absolute;
            top: 50%;
            left: 0;
            font-size: 30px;
            transform: translateY(-50%);
        }
    </style>
</head>
<body>
    <script>
        var elonCounter = 0;
        var intervalId;

function moveElon() {
            var elon = document.getElementById("elon");
            var elonHeight = elon.offsetHeight;
            var screenHeight = window.innerHeight;
            var topPos = Math.floor(Math.random() * (screenHeight - elonHeight)) + "px";
            elon.style.top = topPos;

intervalId = setInterval(function() {
                var leftPos = elon.offsetLeft;
                var screenWidth = window.innerWidth;
                if (leftPos > screenWidth) {
                    clearInterval(intervalId);
                    if (elonCounter < 10) {
                        moveElon();
                    } else {
                        alert("ゲームクリア！マークザッカーバーグの勝利です。");
                    }
                } else {
                    elon.style.left = (leftPos + 10) + "px";
                }
            }, 100);
        }

function throwLike() {
            var zuckerberg = document.getElementById("zuckerberg");
            var like = document.createElement("div");
            like.innerHTML = "👍";
            like.classList.add("like");
            like.style.left = zuckerberg.offsetWidth + "px";
            like.style.top = (zuckerberg.offsetTop + (zuckerberg.offsetHeight / 2)) + "px";
            document.body.appendChild(like);

var intervalId = setInterval(function() {
                var leftPos = like.offsetLeft;
                var elon = document.getElementById("elon");
                var rightPos = elon.offsetLeft;
                var likeWidth = like.offsetWidth;

if (leftPos + likeWidth > rightPos) {
                    clearInterval(intervalId);
                    like.remove();
                    elonCounter++;
                    document.getElementById("score").innerHTML = "スコア: " + elonCounter;
                } else {
                    like.style.left = (leftPos + 20) + "px";
                }
            }, 50);
        }

function handleKeyPress(e) {
            var zuckerberg = document.getElementById("zuckerberg");
            var topPos = zuckerberg.offsetTop;
            var zuckerbergHeight = zuckerberg.offsetHeight;
            var screenHeight = window.innerHeight;

if (e.key === "ArrowUp" && topPos > 0) {
                zuckerberg.style.top = (topPos - 10) + "px";
            } else if (e.key === "ArrowDown" && topPos + zuckerbergHeight < screenHeight) {
                zuckerberg.style.top = (topPos + 10) + "px";
            }
        }

document.addEventListener("keydown", handleKeyPress);

moveElon();
    </script>
    <h1>イーロンマスクゲーム</h1>
    <p id="score">スコア: 0</p>
    <div id="elon">🤓</div>
    <div id="zuckerberg">👦</div>

<button onclick="throwLike()">👍 いいね</button>
</body>
</html>
```

なお、絵文字の表示や動作は、お使いのブラウザやデバイスによって異なる場合がありますので、ご了承ください。