Make a DVD screensaver and if the logo hits the corner, the game says YAY!'s game

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

No:25868

118

←

Prev Next

→

Make a DVD screensaver and if the logo hits the co..ALL
Developer User4714｜Date and time 23/11/25 4:10:36
Build time 38.544 sec｜Game capacity 2.27KB｜

Script

Sure! Here's an example of a simple DVD screensaver game implemented as a single HTML file using JavaScript:

In this game, the DVD logo image is randomly placed on the canvas, and it moves in a bouncing manner. If the logo hits any of the canvas borders (corners), the game logs "YAY!". Please note that you'll need to replace the `"emozi_himawari.png"` with the actual path to your DVD logo image file. Also, make sure to place the `emozi_all/dvd.png` file in the same directory as the HTML file. Remember to save the above code as an HTML file, and you can open it in any web browser to play the game!

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a simple DVD screensaver game implemented as a single HTML file using JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
  <title>DVD Screensaver Game</title>
  <style>
    canvas {
        border: 1px solid black;
    }
  </style>
</head>
<body>
  <script type="text/javascript">

// Get canvas element
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    document.body.appendChild(canvas);

// Set canvas size
    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;

// Set up DVD logo parameters
    const dvdWidth = 150;
    const dvdHeight = 100;
    const dvdLogo = new Image();
    dvdLogo.src = "dvd_logo.png";
    let x = Math.random() * (canvas.width - dvdWidth);
    let y = Math.random() * (canvas.height - dvdHeight);
    let dx = 1; // movement in x-direction
    let dy = 1; // movement in y-direction

// Function to draw the logo on the canvas
    function drawLogo() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
      ctx.drawImage(dvdLogo, x, y, dvdWidth, dvdHeight);
    }

// Function to update logo position and check for collision
    function update() {
      if (x + dx < 0 || x + dvdWidth + dx > canvas.width) {
        dx = -dx; // reverse horizontal direction
        yay();
      }
      if (y + dy < 0 || y + dvdHeight + dy > canvas.height) {
        dy = -dy; // reverse vertical direction
        yay();
      }

x += dx;
      y += dy;

drawLogo();

requestAnimationFrame(update);
    }

// Function to log "YAY!" when collision occurs
    function yay() {
      console.log("YAY!");
    }

// Start the game
    dvdLogo.onload = function() {
      update();
    };
  </script>
</body>
</html>
```

In this game, the DVD logo image is randomly placed on the canvas, and it moves in a bouncing manner. If the logo hits any of the canvas borders (corners), the game logs "YAY!".

Please note that you'll need to replace the `"dvd_logo.png"` with the actual path to your DVD logo image file. Also, make sure to place the `dvd_logo.png` file in the same directory as the HTML file.

Remember to save the above code as an HTML file, and you can open it in any web browser to play the game!