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

No:31496

←

Prev Next

→

Boat war
Developer User10392｜Date and time 23/12/27 6:20:00
Build time 18.361 sec｜Game capacity 3.269KB｜

Script

Sure! Here's an example of a simple Boat War game implemented as a single HTML file, using JavaScript and pictograms. You can play it on a smartphone by tapping on the screen to shoot missiles at the boats.

Boat War

In this game, a boat is displayed at the bottom of the play area, and whenever the screen is tapped, a missile is launched from the top of the screen towards the boat. The goal is to hit the boat with the missiles. If a missile hits the boat, the game ends.

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Boat War</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
        }
        #playArea {
            position: relative;
            width: 300px;
            height: 400px;
            margin: 20px auto;
            background: #cce2ff;
            border: 1px solid #999;
        }
        #boat {
            position: absolute;
            bottom: 10px;
            width: 60px;
            height: 40px;
            background-image: url('boat.png');
            background-size: cover;
        }
        .missile {
            position: absolute;
            width: 10px;
            height: 20px;
            background: red;
        }
    </style>
</head>
<body>
    <h1>Boat War</h1>
    <div id="playArea">
        <div id="boat"></div>
    </div>
    <script>
        var boat = document.getElementById('boat');
        var playArea = document.getElementById('playArea');
        var missiles = [];

// Move the boat when the screen is tapped
        playArea.addEventListener('click', function(event) {
            var missile = document.createElement('div');
            missile.className = 'missile';
            missile.style.left = event.clientX - 5 + 'px';
            playArea.appendChild(missile);
            missiles.push(missile);

moveMissiles();
        });

// Move the missiles upwards every 10ms
        function moveMissiles() {
            var missileSpeed = 5;
            var gameOver = false;

var interval = setInterval(function() {
                for (var i = 0; i < missiles.length; i++) {
                    var missile = missiles[i];
                    var missilePosition = missile.offsetTop;
                    missile.style.top = missilePosition - missileSpeed + 'px';

// Check if missile hits the boat
                    if (missilePosition <= boat.offsetTop + boat.offsetHeight &&
                        missilePosition + missile.offsetHeight >= boat.offsetTop &&
                        missile.offsetLeft >= boat.offsetLeft &&
                        missile.offsetLeft <= boat.offsetLeft + boat.offsetWidth) {
                        gameOver = true;
                        break;
                    }
                }

// Remove missiles that are out of the play area
                missiles = missiles.filter(function(missile) {
                    return missile.offsetTop >= 0;
                });

if (gameOver) {
                    clearInterval(interval);
                    alert('Game Over');
                    playArea.removeEventListener('click');
                }
            }, 10);
        }
    </script>
</body>
</html>
```