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

No:20376

A super villain running from superheroes
Developer User8958｜Date and time 23/10/9 9:05:17
Build time 12.446 sec｜Game capacity 3.455KB｜

Script

Sure, here's an example of a simple game where a super villain is running from superheroes. It uses pictograms and is designed for smartphone operation. It is implemented as a single HTML file and enclosed in script tags:

Super Villain Run

Can you help the villain escape?

run boy

Make sure to replace 'emozi_bear.png' and 'emozi_chicken.png' with the actual pictogram images you want to use for the super villain and superheroes.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Super Villain Run</title>
    <style>
        body {
            background-color: #000;
            color: #fff;
            font-family: Arial, sans-serif;
            text-align: center;
            padding: 50px;
        }
        
        #game-container {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 300px;
        }
        
        #super-villain, .super-hero {
            width: 100px;
            height: 100px;
        }
        
        #super-villain {
            background-image: url('super-villain.png');
            background-size: cover;
        }
        
        .super-hero {
            background-image: url('super-hero.png');
            background-size: cover;
        }
    </style>
</head>
<body>
    <h1>Super Villain Run</h1>
    <h2>Can you help the villain escape?</h2>
    
    <div id="game-container">
        <div id="super-villain"></div>
        <div class="super-hero"></div>
        <div class="super-hero"></div>
        <div class="super-hero"></div>
    </div>
    
    <script>
        window.onload = function() {
            var container = document.getElementById('game-container');
            var superVillain = document.getElementById('super-villain');
            var superHeroes = document.getElementsByClassName('super-hero');
            
            var gameInterval = setInterval(function() {
                var containerWidth = container.offsetWidth;
                var containerHeight = container.offsetHeight;
                var villainWidth = superVillain.offsetWidth;
                var villainHeight = superVillain.offsetHeight;
                
                var villainX = superVillain.offsetLeft;
                var villainY = superVillain.offsetTop;
                
                var randomX = Math.floor(Math.random() * (containerWidth - villainWidth));
                var randomY = Math.floor(Math.random() * (containerHeight - villainHeight));
                
                superVillain.style.left = randomX + 'px';
                superVillain.style.top = randomY + 'px';
                
                for (var i = 0; i < superHeroes.length; i++) {
                    var hero = superHeroes[i];
                    
                    if (isColliding(villainX, villainY, villainWidth, villainHeight, hero.offsetLeft, hero.offsetTop, hero.offsetWidth, hero.offsetHeight)) {
                        clearInterval(gameInterval);
                        alert('Game Over! Super Villain was caught by a Super Hero!');
                    }
                }
            }, 1000);
            
            function isColliding(x1, y1, w1, h1, x2, y2, w2, h2) {
                return x1 < x2 + w2 &&
                       x1 + w1 > x2 &&
                       y1 < y2 + h2 &&
                       y1 + h1 > y2;
            }
        };
    </script> run boy
</body>
</html>
```

Make sure to replace 'super-villain.png' and 'super-hero.png' with the actual pictogram images you want to use for the super villain and superheroes.