Gun game Big map high quality areas's game

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

No:14566

←

Prev Next

→

Gun game Big map high quality areas
Developer User6286｜Date and time 23/9/3 3:56:45
Build time 28.672 sec｜Game capacity 3.584KB｜

Script

Sure! Here's a basic implementation of a gun game with a big map, high-quality areas using JavaScript and HTML. Keep in mind this is a very basic starting point, and you can add more functionality and features to make it a complete game.

To use this code, you need to replace the `map.jpg` URL with the actual URL of your desired map image. You can also add more areas by duplicating the `div` with the class `area` and adjusting the `top` and `left` positions. When you open the HTML file in a web browser, you'll see the game map with green areas. You can control the player using the arrow keys. As the player moves into an area, its background color will change to blue, indicating that the player has entered that area.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>

<head>
    <title>Gun Game</title>
    <style>
        #game-map {
            width: 400px;
            height: 400px;
            background: url("map.jpg") no-repeat;
            background-size: cover;
            position: relative;
        }

.area {
            position: absolute;
            width: 50px;
            height: 50px;
            background-color: green;
            opacity: 0.5;
        }

#player {
            position: absolute;
            width: 50px;
            height: 50px;
            background-color: red;
        }
    </style>
</head>

player.style.top = "0px";
            player.style.left = "0px";

function movePlayer(event) {
                var keyCode = event.keyCode;
                var playerTop = parseInt(player.style.top);
                var playerLeft = parseInt(player.style.left);

if (keyCode === 37 && playerLeft > 0) { // Left Arrow
                    player.style.left = playerLeft - 10 + "px";
                } else if (keyCode === 38 && playerTop > 0) { // Up Arrow
                    player.style.top = playerTop - 10 + "px";
                } else if (keyCode === 39 && playerLeft < gameMap.offsetWidth - player.offsetWidth) { // Right Arrow
                    player.style.left = playerLeft + 10 + "px";
                } else if (keyCode === 40 && playerTop < gameMap.offsetHeight - player.offsetHeight) { // Down Arrow
                    player.style.top = playerTop + 10 + "px";
                }

checkCollision();
            }

document.addEventListener("keydown", movePlayer);
        });
    </script>
</body>

</html>
```

When you open the HTML file in a web browser, you'll see the game map with green areas. You can control the player using the arrow keys. As the player moves into an area, its background color will change to blue, indicating that the player has entered that area.