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

No:12843

←

Prev Next

→

Pokemon scarlet
Developer User5583｜Date and time 23/8/23 23:25:58
Build time 30.446 sec｜Game capacity 2.408KB｜

Script

Pokemon Scarlet

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

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

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <title>Pokemon Scarlet</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      background-color: #f8f8f8;
    }
    #game-container {
      width: 400px;
      height: 600px;
      border: 2px solid #000;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 20px;
      background-color: #fff;
    }
    #game-title {
      font-size: 24px;
      font-weight: bold;
      margin-bottom: 20px;
    }
    #player {
      width: 100px;
      height: 100px;
      background-image: url('pictogram_player.png');
      background-repeat: no-repeat;
      background-size: cover;
      position: absolute;
    }
  </style>
</head>
<body>
  <div id="game-container">
    <h1 id="game-title">Pokemon Scarlet</h1>
    <canvas id="game-canvas" width="400" height="500"></canvas>
  </div>

window.addEventListener('load', () => {
      const canvas = document.getElementById('game-canvas');
      const ctx = canvas.getContext('2d');

function drawPlayer() {
        const playerImg = new Image();
        playerImg.src = 'pictogram_player.png';
        playerImg.onload = () => {
          ctx.drawImage(playerImg, playerX, playerY, 50, 50);
        };
      }

function clearCanvas() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
      }

function handleKeyDown(event) {
        const speed = 10;

switch (event.key) {
          case 'ArrowUp':
            if (playerY > 0) {
              playerY -= speed;
            }
            break;
          case 'ArrowDown':
            if (playerY + 50 < canvas.height) {
              playerY += speed;
            }
            break;
          case 'ArrowLeft':
            if (playerX > 0) {
              playerX -= speed;
            }
            break;
          case 'ArrowRight':
            if (playerX + 50 < canvas.width) {
              playerX += speed;
            }
            break;
          default:
            break;
        }
        clearCanvas();
        drawPlayer();
      }

drawPlayer();
      window.addEventListener('keydown', handleKeyDown);
    });
  </script>
</body>
</html>