Please make a game where the player has to hit targets using a gun that shoots bullets's game

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

No:12641

←

Prev Next

→

Please make a game where the player has to hit tar..ALL
Developer User5358｜Date and time 23/8/21 7:04:03
Build time 10.988 sec｜Game capacity 3.98KB｜

Script

Sure! Here's an example of a simple game where the player has to hit targets using a gun that shoots bullets. The game will be implemented as a single HTML file with JavaScript enclosed in script tags:

In this game, the player can click on the game area to fire the gun. The bullet will be launched from the gun and move towards the top of the screen. If the bullet hits a target, the target will turn green and disappear after half a second. The game will create new targets randomly after each successful hit.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Target Shooting Game</title>
    <style>
        #game {
            width: 400px;
            height: 400px;
            border: 1px solid black;
            position: relative;
        }
        .target {
            width: 40px;
            height: 40px;
            background-color: red;
            border-radius: 50%;
            position: absolute;
            cursor: pointer;
            pointer-events: none;
        }
        #gun {
            width: 40px;
            height: 20px;
            background-color: gray;
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
        }
        #bullet {
            width: 5px;
            height: 10px;
            background-color: black;
            position: absolute;
            display: none;
        }
    </style>
</head>
<body>
    <div id="game">
        <div id="gun"></div>
        <div id="bullet"></div>
    </div>
    
    <script>
        var gameArea = document.getElementById('game');
        var target = createTarget();
        var gun = document.getElementById('gun');
        var bullet = document.getElementById('bullet');
        var timer;
        
        gameArea.addEventListener('click', fireGun);
        
        function createTarget() {
            var target = document.createElement('div');
            target.className = 'target';
            target.style.left = Math.floor(Math.random() * 360) + 'px';
            target.style.top = Math.floor(Math.random() * 360) + 'px';
            gameArea.appendChild(target);
            target.addEventListener('click', hitTarget);
            return target;
        }
        
        function fireGun() {
            clearInterval(timer);
            bullet.style.display = 'block';
            bullet.style.left = parseInt(gun.style.left) + 18 + 'px';
            bullet.style.bottom = '20px';
            
            var interval = 20;
            timer = setInterval(function() {
                var bulletPos = parseInt(bullet.style.bottom);
                
                if (bulletPos >= 380) {
                    bullet.style.display = 'none';
                    clearInterval(timer);
                } else {
                    bullet.style.bottom = bulletPos + interval + 'px';
                    checkCollision();
                }
            }, 20);
        }
        
        function checkCollision() {
            var targetPos = target.getBoundingClientRect();
            var bulletPos = bullet.getBoundingClientRect();
            
            if (bulletPos.left >= targetPos.left &&
                bulletPos.right <= targetPos.right &&
                bulletPos.bottom >= targetPos.top &&
                bulletPos.top <= targetPos.bottom) {
                target.style.backgroundColor = 'green';
                target.removeEventListener('click', hitTarget);
                setTimeout(function() {
                    gameArea.removeChild(target);
                    target = createTarget();
                }, 500);
            }
        }
        
        function hitTarget() {
            target.style.backgroundColor = 'green';
            target.removeEventListener('click', hitTarget);
            setTimeout(function() {
                gameArea.removeChild(target);
                target = createTarget();
            }, 500);
        }
    </script>
</body>
</html>
```