AI game creator

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

No:39754

←

Prev Next

→

Shooting Game
Developer User17792｜Date and time 24/1/30 1:54:15
Build time 21.892 sec｜Game capacity 4.919KB｜

Script

لعبة إطلاق النار

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームランキング

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

لعبة إطلاق النار

<!DOCTYPE html>
<html>

<head>
    <title>لعبة إطلاق النار</title>
    <style>
        body {
            background-color: #000;
            text-align: center;
            color: #fff;
            font-family: Arial, sans-serif;
        }

.game-container {
            position: relative;
            margin: 0 auto;
            width: 90vw;
            height: 80vh;
            background-color: #444;
            border-radius: 10px;
            overflow: hidden;
        }

.cannon {
            position: absolute;
            bottom: 10px;
            left: 50%;
            transform: translateX(-50%);
        }

.bullet {
            position: absolute;
            bottom: 65px;
            width: 10px;
            height: 20px;
            background-color: #fff;
        }

.target {
            position: absolute;
            top: 10px;
            left: 50%;
            transform: translateX(-50%);
            width: 50px;
            height: 50px;
            background-color: #ff0000;
            border-radius: 50%;
        }
    </style>
</head>

// Set initial positions
            var bulletLeft = gameContainer.offsetWidth / 2 - bulletElement.offsetWidth / 2;
            var bulletBottom = parseInt(window.getComputedStyle(bulletElement).bottom);
            var targetTop = parseInt(window.getComputedStyle(targetElement).top);
            var cannonWidth = cannonElement.offsetWidth;
            var cannonLeft = gameContainer.offsetWidth / 2 - cannonWidth / 2;

// Set game variables
            var bulletSpeed = 5;
            var targetSpeed = 2;
            var score = 0;

// Start game loop
            setInterval(updateGame, 16);

// Update game
            function updateGame() {
                bulletBottom += bulletSpeed;
                targetTop += targetSpeed;

// Check bullet target collision
                var bulletCenterX = bulletLeft + bulletElement.offsetWidth / 2;
                var bulletCenterY = gameContainer.offsetHeight - bulletBottom - bulletElement.offsetHeight / 2;
                var targetCenterX = gameContainer.offsetWidth / 2;
                var targetCenterY = targetTop + targetElement.offsetHeight / 2;

var distanceX = Math.abs(bulletCenterX - targetCenterX);
                var distanceY = Math.abs(bulletCenterY - targetCenterY);
                var distanceSquared = Math.pow(distanceX, 2) + Math.pow(distanceY, 2);
                var radiusSquared = Math.pow(targetElement.offsetWidth / 2, 2);

if (distanceSquared <= radiusSquared) {
                    // Hit target
                    score++;
                    bulletBottom = parseInt(window.getComputedStyle(bulletElement).bottom);
                    targetTop = parseInt(window.getComputedStyle(targetElement).top);

// Randomize target position
                    var randomPosition = Math.floor(Math.random() * (gameContainer.offsetWidth - targetElement.offsetWidth));
                    targetElement.style.left = randomPosition + "px";
                }

// Update elements positions
                bulletElement.style.left = bulletLeft + "px";
                bulletElement.style.bottom = bulletBottom + "px";
                targetElement.style.top = targetTop + "px";
            }

// Move cannon
            gameContainer.addEventListener("mousemove", function(e) {
                var mouseX = e.clientX - gameContainer.getBoundingClientRect().left;
                var cannonNewLeft = mouseX - cannonWidth / 2;
                if (cannonNewLeft >= 0 && cannonNewLeft <= gameContainer.offsetWidth - cannonWidth) {
                    cannonLeft = cannonNewLeft;
                    cannonElement.style.left = cannonLeft + "px";
                    bulletLeft = cannonLeft + cannonWidth / 2 - bulletElement.offsetWidth / 2;
                    bulletElement.style.left = bulletLeft + "px";
                }
            });

// Shoot bullet
            gameContainer.addEventListener("click", function() {
                bulletSpeed = 5;
            });
        });
    </script>
</body>

</html>