Shooting at a festival food stall. Aim and guess to get various prizes.'s game

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

No:10529

148

←

Prev Next

→

Shooting at a festival food stall. Aim and guess t..ALL
Developer User4566｜Date and time 23/7/31 21:24:55
Build time 22.585 sec｜Game capacity 2.502KB｜

Script

🎯

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>屋台の射的</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            font-family: Arial, sans-serif;
        }

.game-container {
            text-align: center;
        }

.target {
            font-size: 5em;
            cursor: pointer;
        }

.prize {
            font-size: 2em;
            margin-top: 1em;
        }
    </style>
</head>
<body>
    <div class="game-container">
        <div class="target">🎯</div>
        <div class="prize"></div>
    </div>

// ランダムな座標を生成するための関数
        function getRandomPos() {
            const container = document.querySelector('.game-container');
            const containerRect = container.getBoundingClientRect();

const x = Math.random() * (containerRect.width - 100);
            const y = Math.random() * (containerRect.height - 100);

return {
                x: x + containerRect.left,
                y: y + containerRect.top
            };
        }

// ゲームの初期化
        function initGame() {
            const target = document.querySelector('.target');
            const prize = document.querySelector('.prize');

target.addEventListener('click', shootTarget);
            target.addEventListener('touchend', shootTarget);

const pos = getRandomPos();
            target.style.left = `${pos.x}px`;
            target.style.top = `${pos.y}px`;

prize.innerText = '';
        }

// ターゲットをクリックした時の処理
        function shootTarget() {
            const target = document.querySelector('.target');
            const prize = document.querySelector('.prize');

prize.innerText = '景品ゲット！🎉';

target.removeEventListener('click', shootTarget);
            target.removeEventListener('touchend', shootTarget);
        }

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