Create a sword fighting marble game's game

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

No:12897

109

←

Prev Next

→

Create a sword fighting marble game
Developer User5619｜Date and time 23/8/24 23:27:33
Build time 22.86 sec｜Game capacity 2.948KB｜

Script

Sure! Here's an example of a sword-fighting marble game implemented as a single HTML file using JavaScript:

This game uses a canvas element to display the game objects (sword and marble) and detects touch or mouse movements to control the sword's position. The marble moves around the screen randomly, and the objective of the game is to prevent the marble from colliding with the sword. If a collision occurs, a "Game Over" alert is displayed, and the game is reset upon dismissal.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

Sure! Here's an example of a sword-fighting marble game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <style>
        canvas {
            border: 1px solid #000;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Function to update game state
            function update() {
                // Move the marble
                marble.x += marble.dx;
                marble.y += marble.dy;
                
                // Check collisions
                if (marble.x < 0 || marble.x > canvas.width) {
                    marble.dx *= -1; // reverse direction on wall collision
                }
                if (marble.y < 0 || marble.y > canvas.height) {
                    marble.dy *= -1;
                }
                
                // Draw game objects
                ctx.clearRect(0, 0, canvas.width, canvas.height);
                ctx.fillStyle = "#000";
                ctx.fillRect(sword.x - sword.size / 2, sword.y - sword.size / 2, sword.size, sword.size);
                ctx.fillStyle = "#f00";
                ctx.beginPath();
                ctx.arc(marble.x, marble.y, marble.size, 0, 2 * Math.PI);
                ctx.fill();
                
                // Check collision with sword
                var dist = Math.sqrt(Math.pow(marble.x - sword.x, 2) + Math.pow(marble.y - sword.y, 2));
                if (dist < sword.size / 2 + marble.size) {
                    alert("Game Over!");
                    location.reload(); // Reset game
                }
                
                requestAnimationFrame(update); // Loop the game
            }

// Handle touch/mouse events
            canvas.addEventListener("touchmove", function(event) {
                sword.x = event.touches[0].clientX;
                sword.y = event.touches[0].clientY;
            });
            canvas.addEventListener("mousemove", function(event) {
                sword.x = event.clientX;
                sword.y = event.clientY;
            });
            
            // Start the game
            update();
        });
    </script>
</body>
</html>
```