Google dino with textures's game

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

No:40477

←

Prev Next

→

Google dino with textures
Developer User18141｜Date and time 24/2/3 2:39:46
Build time 17.153 sec｜Game capacity 4.785KB｜

Script

Sure! Here's an example of a simple game inspired by the Google Chrome Dinosaur Game, implemented as a single HTML file with JavaScript. The game can be played on a smartphone and it uses pictograms/icons for the visuals.

You can save the above code in a file with a .html extension and open it in a web browser on your smartphone to play the game. The dino can be controlled by tapping on the screen to make it jump over the cactus. If the dino collides with the cactus, 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>Dino Game</title>
    <style>
        body {
            margin: 0;
            padding: 0;
            overflow: hidden;
            font-family: Arial, sans-serif;
            background-color: #f7f7f7;
        }
        
        canvas {
            display: block;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas"></canvas>
    
    <script>
        // Game variables
        var canvas, ctx;
        var dino, cactus;
        var gravity;
        var isGameOver;
        
        // Dino object
        var Dino = {
            x: 50,
            y: 0,
            width: 50,
            height: 50,
            jumpForce: 15,
            velocity: 0,
            
            jump: function() {
                if (this.y === 0) {
                    this.velocity -= this.jumpForce;
                }
            },
            
            update: function() {
                this.velocity += gravity;
                this.y += this.velocity;
                
                if (this.y > canvas.height - this.height) {
                    this.y = canvas.height - this.height;
                    this.velocity = 0;
                }
            },
            
            draw: function() {
                ctx.fillStyle = "#000";
                ctx.fillRect(this.x, this.y, this.width, this.height);
            }
        };
        
        // Cactus object
        var Cactus = {
            x: 0,
            y: 0,
            width: 50,
            height: 50,
            speed: 5,
            
            update: function() {
                this.x -= this.speed;
                
                if (this.x + this.width < 0) {
                    this.x = canvas.width;
                    this.y = Math.random() * (canvas.height - this.height);
                }
            },
            
            draw: function() {
                ctx.fillStyle = "#f00";
                ctx.fillRect(this.x, this.y, this.width, this.height);
            }
        };
        
        // Game initialization
        function init() {
            canvas = document.getElementById("gameCanvas");
            ctx = canvas.getContext("2d");
            
            canvas.width = window.innerWidth;
            canvas.height = window.innerHeight;
            
            dino = Object.create(Dino);
            dino.y = canvas.height - dino.height;
            
            cactus = Object.create(Cactus);
            cactus.x = canvas.width;
            cactus.y = Math.random() * (canvas.height - cactus.height);
            
            gravity = 0.5;
            isGameOver = false;
            
            loop();
        }
        
        // Game loop
        function loop() {
            if (!isGameOver) {
                update();
                render();
                requestAnimationFrame(loop);
            }
        }
        
        // Update game objects
        function update() {
            dino.update();
            cactus.update();
            
            if (checkCollision(dino, cactus)) {
                gameOver();
            }
        }
        
        // Render game objects
        function render() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            
            dino.draw();
            cactus.draw();
        }
        
        // Check for collision between dino and cactus
        function checkCollision(obj1, obj2) {
            return (
                obj1.x < obj2.x + obj2.width &&
                obj2.x < obj1.x + obj1.width &&
                obj1.y < obj2.y + obj2.height &&
                obj2.y < obj1.y + obj1.height
            );
        }
        
        // Game over
        function gameOver() {
            isGameOver = true;
            alert("Game over!");
        }
        
        // Event listeners
        window.addEventListener("keydown", function(event) {
            if (event.keyCode === 32) { // Spacebar key
                dino.jump();
            }
        });
        
        window.addEventListener("resize", function() {
            canvas.width = window.innerWidth;
            canvas.height = window.innerHeight;
        });
        
        // Start game
        init();
    </script>
</body>
</html>
```