[Operation] iPhone now supports tilt. You need to press the button to allow it.'s game

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

No:8829

324

←

Prev Next

→

[Operation] iPhone now supports tilt. You need to ..ALL
Developer User4246｜Date and time 23/7/18 18:01:39
Build time 15.103 sec｜Game capacity 1.484KB｜

Script

了解しました。以下に、スマートフォンで遊べるシンプルなゲームの例を示します。

上記のプログラムは、スマートフォンの傾きに応じて赤いボールを動かすゲームです。スマートフォンの傾きに合わせて、ボールが左右に移動し、上下には反対方向に移動します。スマートフォンでこのHTMLファイルを開いて傾けて遊ぶことができます。

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

了解しました。以下に、スマートフォンで遊べるシンプルなゲームの例を示します。

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Tilting Ball Game</title>
    <style>
      #ball {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        border-radius: 50%;
        width: 50px;
        height: 50px;
        background-color: red;
      }
    </style>
  </head>
  <body>
    <div id="ball"></div>

function handleMotionEvent(event) {
        var ball = document.getElementById('ball');
        var accelerationX = event.accelerationIncludingGravity.x;
        var accelerationY = event.accelerationIncludingGravity.y;

var ballX = parseFloat(ball.style.left) || 50;
        var ballY = parseFloat(ball.style.top) || 50;
        var moveX = (accelerationX / 10) * 5;
        var moveY = (accelerationY / 10) * 5;

ball.style.left = ballX + moveX + 'px';
        ball.style.top = ballY - moveY + 'px';
      }
    </script>
  </body>
</html>
```