A boss with a face🐱body🐶arms💪legs🚗 nested together, each with a moving rotating animated attack.'s game

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

No:5470

2315

←

Prev Next

→

A boss with a face🐱body🐶arms💪legs🚗 nested together..ALL
Developer User3694｜Date and time 23/6/30 4:15:43
Build time 37.168 sec｜Game capacity 3.346KB｜

Script

以下は、要件に合わせたゲームの例です。顔が🐱体が🐶腕が💪足が🚗で入れ子になっており、プレイヤーがスマホの操作でそれぞれを移動・回転させてボスに対して攻撃することができます。

🐱

🐶

💪

🚗

このプログラムでは、デバイスの傾きに応じて顔、体、腕、足のEmojiを移動および回転させます。また、画面をタップするとボスにダメージを与えるアクションが追加されています（ダメージを与える処理は未実装です）。プレイヤーがスマホでゲームを操作でき、絵文字を使用してゲーム化されています。

←

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>Emoji Boss Fight</title>
  <style>
    #boss {
      position: relative;
      width: 100px;
      height: 100px;
      background: black;
      border-radius: 50%;
    }
    .emoji {
      position: absolute;
      width: 50px;
      height: 50px;
      line-height: 50px;
      text-align: center;
      font-size: 30px;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <div id="boss">
    <div id="face" class="emoji">🐱</div>
    <div id="body" class="emoji">🐶</div>
    <div id="arm" class="emoji">💪</div>
    <div id="leg" class="emoji">🚗</div>
  </div>

// 入力に応じてアクションを実行する関数
    function handleOrientation(event) {
      // デバイスの傾きを取得
      var gamma = event.gamma; // 左右の傾き
      var beta = event.beta; // 前後の傾き

// Emojiの要素を取得
      var face = document.getElementById('face');
      var body = document.getElementById('body');
      var arm = document.getElementById('arm');
      var leg = document.getElementById('leg');

// Emojiの移動量を計算
      var moveX = gamma / 10; // 左右の傾きを適用
      var moveY = beta / 10; // 前後の傾きを適用

// Emojiの回転角度を計算
      var rotateX = gamma / 2; // 左右の傾きを適用
      var rotateY = beta / 2; // 前後の傾きを適用

// Emojiを移動・回転させる
      face.style.transform = `translate(${moveX}px, ${moveY}px) rotate(${rotateX}deg)`;
      body.style.transform = `translate(${moveX}px, ${moveY}px) rotate(${rotateY}deg)`;
      arm.style.transform = `translate(${moveX}px, ${moveY}px) rotate(${rotateX}deg)`;
      leg.style.transform = `translate(${moveX}px, ${moveY}px) rotate(${rotateY}deg)`;

// プレイヤーが画面をタップした場合にボスにダメージを与える
      document.body.addEventListener('click', function() {
        // ボスの要素を取得
        var boss = document.getElementById('boss');
        
        // ボスを点滅させるアニメーションを追加
        boss.style.animation = 'flash 0.5s infinite';

// 1秒後に点滅アニメーションを終了し、ボスにダメージを与える
        setTimeout(function() {
          boss.style.animation = '';
          // ダメージを与える処理を追加
          // ...
        }, 1000);
      });
    }
  </script>
</body>
</html>
```