AI game creator

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

No:7868

142

←

Prev Next

→

licorice recoil
Developer User3788｜Date and time 23/7/10 4:15:15
Build time 9.521 sec｜Game capacity 2.225KB｜

Script

了解です。リコリスリコイルというゲームを作成します。以下が実装例です。

このゲームでは、画面内で移動する四角いボックスを操作します。キーボードの上下左右キーを使って移動させることができます。ボックスが画面の外に出てしまうとゲームオーバーとなり、アラートが表示されます。ゲームの要素は実装しましたが、絵文字や他の要素を追加したり、さらにゲームを拡張するなど、さまざまな改良を加えることができます。

←

Prev　Next

→ 　

Back　

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

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

了解です。リコリスリコイルというゲームを作成します。以下が実装例です。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>リコリスリコイル</title>
  <style>
    body {
      text-align: center;
      font-size: 24px;
    }
    #box {
      width: 100px;
      height: 100px;
      background-color: #ff00ff;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      transition: top 0.3s, left 0.3s;
    }
  </style>
</head>
<body>
  <div id="box"></div>
  <script>
    document.addEventListener('keydown', (event) => {
      const box = document.getElementById('box');
      let top = parseInt(box.style.top);
      let left = parseInt(box.style.left);
      
      if (event.key === 'ArrowUp') {
        top -= 50;
      } else if (event.key === 'ArrowDown') {
        top += 50;
      } else if (event.key === 'ArrowLeft') {
        left -= 50;
      } else if (event.key === 'ArrowRight') {
        left += 50;
      }
      
      box.style.top = `${top}px`;
      box.style.left = `${left}px`;
      
      checkCollision(box);
    });
    
    function checkCollision(box) {
      const windowWidth = window.innerWidth;
      const windowHeight = window.innerHeight;
      
      const boxLeft = parseInt(box.style.left);
      const boxTop = parseInt(box.style.top);
      const boxRight = boxLeft + box.offsetWidth;
      const boxBottom = boxTop + box.offsetHeight;
      
      if (boxLeft <= 0 || boxRight >= windowWidth || boxTop <= 0 || boxBottom >= windowHeight) {
        alert('ゲームオーバー！');
        document.removeEventListener('keydown', () => {});
      }
    }
  </script>
</body>
</html>
```

このゲームでは、画面内で移動する四角いボックスを操作します。キーボードの上下左右キーを使って移動させることができます。ボックスが画面の外に出てしまうとゲームオーバーとなり、アラートが表示されます。

ゲームの要素は実装しましたが、絵文字や他の要素を追加したり、さらにゲームを拡張するなど、さまざまな改良を加えることができます。