AI game creator

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

No:29107

←

Prev Next

→

Boy jump over suff
Developer User9117｜Date and time 23/12/16 2:38:57
Build time 21.774 sec｜Game capacity 2.587KB｜

Script

This is an example of a simple Jumping Boy Game implemented as a single HTML file. The game is designed for smartphone operation and uses pictograms to represent the boy. It's written in JavaScript and enclosed in script tags. In this game, the user controls a boy character by tapping the screen. Whenever the user taps, the boy jumps by increasing its velocity. The game loop continuously updates the boy's position based on its velocity, giving the appearance of jumping. Gravity is applied to the boy's velocity to simulate a natural jump motion. The boy is represented as a div element with a background image of a boy pictogram. Its position is changed by modifying the `bottom` CSS property based on the current position variable. Note: In order to fully run this game, you will need to replace the `emozi_all/game.png` URL in the CSS with the actual image file path.

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
    <title>Jumping Boy Game</title>
    <style>
        .boy {
            height: 100px;
            width: 100px;
            position: absolute;
            bottom: 0;
            background-image: url('boy.png');
            background-size: cover;
        }
    </style>
</head>
<body>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            // Create the boy element dynamically
            var boy = document.createElement('div');
            boy.className = 'boy';
            document.body.appendChild(boy);

// Set initial boy position and velocity
            var position = 0;
            var velocity = 0;

// Jump function triggered on click
            function jump() {
                // Update boy velocity to make it jump
                velocity = 10;
            }

// Update boy position and velocity every frame
            function update() {
                // Gravity effect on boy's velocity
                velocity -= 1;
                position += velocity;

// Restrict boy to not go below the ground level
                if (position < 0) {
                    position = 0;
                    velocity = 0;
                }

// Update boy element's position
                boy.style.bottom = position + 'px';

// Recursively call the update function on each frame
                requestAnimationFrame(update);
            }

// Trigger jump on screen touch
            document.addEventListener('touchstart', jump);

// Start the game loop
            update();
        });
    </script>
</body>
</html>
```

In this game, the user controls a boy character by tapping the screen. Whenever the user taps, the boy jumps by increasing its velocity. The game loop continuously updates the boy's position based on its velocity, giving the appearance of jumping. Gravity is applied to the boy's velocity to simulate a natural jump motion.

The boy is represented as a div element with a background image of a boy pictogram. Its position is changed by modifying the `bottom` CSS property based on the current position variable.

Note: In order to fully run this game, you will need to replace the `boy.png` URL in the CSS with the actual image file path.