A game where you shoot a target and gain points is you hit it or not. The item that you control should look like a gun and should shoot bullets. There should also be an up and down slider to move the gun, and a button to shoot. The target should either move on its own, or move to a new spot each time the bullet touches it's game

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

No:34677

←

Prev Next

→

A game where you shoot a target and gain points is..ALL
Developer User16298｜Date and time 24/1/11 8:20:34
Build time 17.78 sec｜Game capacity 5.312KB｜

Script

Sure! Here's an example implementation of the game you described in a single HTML file:

This HTML file contains the necessary JavaScript code within the script tags to implement the target shooting game as you described. The game interface includes a gun (represented as a colored rectangle), a bullet (represented as a red line), and a target (represented as a green rectangle). The gun can be positioned using an up and down slider and the player can shoot by clicking the shoot button. The bullet's trajectory is determined based on the angle selected by the slider. If the bullet hits the target, the score is increased by 10 and the target's position is randomized. If the bullet misses the target and goes out of bounds, the player is alerted that they missed. You can copy this code into a single HTML file and open it in a web browser to play the game. Keep in mind that visual representations like pictograms are not possible within the limited scope of this text interaction.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

Sure! Here's an example implementation of the game you described in a single HTML file:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Target Shooting Game</title>
    <style>
        #gameContainer {
            position: relative;
            height: 400px;
            background-color: #f2f2f2;
        }
        #gun {
            position: absolute;
            width: 50px;
            height: 30px;
            background-color: #333;
            top: 185px;
            left: 20px;
        }
        #bullet {
            position: absolute;
            width: 10px;
            height: 3px;
            background-color: red;
            top: 200px;
            left: 70px;
            display: none;
        }
        #target {
            position: absolute;
            width: 50px;
            height: 50px;
            background-color: green;
            top: 175px;
            left: 320px;
        }
        .slider {
            margin-top: 10px;
        }
        .button {
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <div id="gameContainer">
        <div id="gun"></div>
        <div id="bullet"></div>
        <div id="target"></div>
    </div>
    <div class="slider">
        <input type="range" min="0" max="360" value="180" id="angleSlider">
    </div>
    <div class="button">
        <button id="shootButton">Shoot</button>
    </div>

// Set initial target position
        randomizeTargetPosition();

// Function to randomize target position
        function randomizeTargetPosition() {
            var containerWidth = document.getElementById("gameContainer").offsetWidth;
            var containerHeight = document.getElementById("gameContainer").offsetHeight;
            var targetWidth = target.offsetWidth;
            var targetHeight = target.offsetHeight;

var maxX = containerWidth - targetWidth;
            var maxY = containerHeight - targetHeight;

var randomX = Math.floor(Math.random() * maxX);
            var randomY = Math.floor(Math.random() * maxY);

target.style.left = randomX + "px";
            target.style.top = randomY + "px";
        }

// Function to handle shooting action
        function shoot() {
            var angleInDegrees = angleSlider.value;
            var bulletSpeed = 10;

var angleInRadians = (angleInDegrees - 90) * (Math.PI / 180);
            var bulletXSpeed = Math.cos(angleInRadians) * bulletSpeed;
            var bulletYSpeed = Math.sin(angleInRadians) * bulletSpeed;

bullet.style.display = "block";
            bullet.style.left = gun.offsetLeft + "px";
            bullet.style.top = (gun.offsetTop + gun.offsetHeight / 2) + "px";

var intervalId = setInterval(function() {
                var bulletLeft = parseInt(bullet.style.left);
                var bulletTop = parseInt(bullet.style.top);

bullet.style.left = bulletLeft + bulletXSpeed + "px";
                bullet.style.top = bulletTop + bulletYSpeed + "px";

if (bulletLeft > target.offsetLeft && bulletLeft < (target.offsetLeft + target.offsetWidth) &&
                    bulletTop > target.offsetTop && bulletTop < (target.offsetTop + target.offsetHeight)) {
                    clearInterval(intervalId);
                    bullet.style.display = "none";
                    randomizeTargetPosition();
                    score += 10;
                    alert("You hit the target!\nScore: " + score);
                }

if (bulletLeft < 0 || bulletLeft > document.getElementById("gameContainer").offsetWidth ||
                    bulletTop < 0 || bulletTop > document.getElementById("gameContainer").offsetHeight) {
                    clearInterval(intervalId);
                    bullet.style.display = "none";
                    alert("You missed the target!");
                }
            }, 16);
        }

// Event listener for the shoot button
        shootButton.addEventListener("click", shoot);
    </script>
</body>
</html>
```

The bullet's trajectory is determined based on the angle selected by the slider. If the bullet hits the target, the score is increased by 10 and the target's position is randomized. If the bullet misses the target and goes out of bounds, the player is alerted that they missed.

You can copy this code into a single HTML file and open it in a web browser to play the game. Keep in mind that visual representations like pictograms are not possible within the limited scope of this text interaction.