สร้างเกมผี's game

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

No:36129

←

Prev Next

→

สร้างเกมผี
Developer Spy｜Date and time 24/1/16 23:38:52
Build time 7.456 sec｜Game capacity 1.502KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
<title>เกมผี</title>
<style>
body {
  background-color: black;
  margin: 0;
  padding: 0;
}
canvas {
  display: block;
}
</style>
</head>
<body>
<script>
// สร้าง canvas element
var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
document.body.appendChild(canvas);

// โหลดภาพผี
var ghostImage = new Image();
ghostImage.src = 'ghost.png';

// สร้าง Object ของผี
var ghost = {
  x: canvas.width / 2,
  y: canvas.height / 2,
  speed: 5,
};

// เริ่มการวาดภาพและเคลื่อนที่ของผี
function draw() {
  context.clearRect(0, 0, canvas.width, canvas.width);
  context.drawImage(ghostImage, ghost.x, ghost.y);

requestAnimationFrame(draw);
}

function moveUp() {
  ghost.y -= ghost.speed;
}

function moveDown() {
  ghost.y += ghost.speed;
}

function moveLeft() {
  ghost.x -= ghost.speed;
}

function moveRight() {
  ghost.x += ghost.speed;
}

// ตรวจจับการกดปุ่มจากสมาร์ทโฟน
document.addEventListener('keydown', function(event) {
  if (event.key === 'ArrowUp') {
    moveUp();
  } else if (event.key === 'ArrowDown') {
    moveDown();
  } else if (event.key === 'ArrowLeft') {
    moveLeft();
  } else if (event.key === 'ArrowRight') {
    moveRight();
  }
});

draw();

</script>
</body>
</html>