AI game creator

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

No:3174

2809

←

Prev Next

→

Tokyo Game Show
Developer User3671｜Date and time 23/6/24 1:17:19
Build time 25.859 sec｜Game capacity 3.204KB｜

Script

に向けて、新作ゲーム「Emoji Escape」を発表します！

😀

このゲームは、画面上の絵文字😀を操作して、3つの障害物を避けながら、できるだけ長く生き残ることが目的です。スマホでも遊べるように、キーボードでの操作を実装しました。絵文字が障害物にぶつかったら、ゲームオーバーです。再度遊ぶ場合は、ページをリロードしてください。楽しんで遊んでください！

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

に向けて、新作ゲーム「Emoji Escape」を発表します！

<html>
  <head>
    <title>Emoji Escape</title>
    <style>
      body {
        background-color: #F5F5F5;
        font-size: 24px;
        text-align: center;
      }

#character {
        position: absolute;
        top: 10px;
        left: 50%;
        transform: translateX(-50%);
        font-size: 60px;
      }

.obstacle {
        position: absolute;
        width: 60px;
        height: 60px;
        border-radius: 50%;
        background-color: #FFC107;
      }

#obstacle1 {
        top: 100px;
        left: 20%;
      }

#obstacle2 {
        top: 200px;
        left: 60%;
      }

#obstacle3 {
        top: 300px;
        left: 40%;
      }
    </style>
  </head>
  <body>
    <div id="character">😀</div>
    <div class="obstacle" id="obstacle1"></div>
    <div class="obstacle" id="obstacle2"></div>
    <div class="obstacle" id="obstacle3"></div>

function moveCharacter(direction) {
        switch (direction) {
          case "up":
            characterTop = Math.max(10, characterTop - 10);
            break;
          case "down":
            characterTop = Math.min(window.innerHeight - 70, characterTop + 10);
            break;
          case "left":
            characterLeft = Math.max(0, characterLeft - 10);
            break;
          case "right":
            characterLeft = Math.min(window.innerWidth - 70, characterLeft + 10);
            break;
        }

character.style.top = characterTop + "px";
        character.style.left = characterLeft + "px";

checkCollision();
      }

function checkCollision() {
        const obstacles = document.querySelectorAll(".obstacle");

obstacles.forEach((obstacle) => {
          const obstacleTop = obstacle.offsetTop;
          const obstacleLeft = obstacle.offsetLeft;

if (
            characterTop < obstacleTop + 60 &&
            characterTop + 60 > obstacleTop &&
            characterLeft < obstacleLeft + 60 &&
            characterLeft + 60 > obstacleLeft
          ) {
            alert("Game over!");
            window.location.reload();
          }
        });
      }

document.addEventListener("keydown", (event) => {
        switch (event.keyCode) {
          case 37:
            moveCharacter("left");
            break;
          case 38:
            moveCharacter("up");
            break;
          case 39:
            moveCharacter("right");
            break;
          case 40:
            moveCharacter("down");
            break;
        }
      });
    </script>
  </body>
</html>