こんなサンプルを作ってみました。 灰色の部分は<div>タグで、アメーバの部分は<img>タグです。 最初、画像はCSSで<div>タグの端に置いておいて、 JavaScriptで取得した加速度の数値を、 CSS3 -webkit-transformのtranslate3dで足してあげてるだけです。 で、肝心のJSの取得ですが、 devicemotionイベントのaccelerationIncludingGravityプロパティ(?)の中に入ってるみたいです。 window.addEventListener("devicemotion",onDevicemotion); こんな風にしてあげといて、 function onDevicemotion(ev){ var aX = ev.accelerationIncludingGravity.x; var aY = ev.acceleration
![『加速度センサーをiPhoneのSafariで取得(JavaScript)』](https://cdn-ak-scissors.b.st-hatena.com/image/square/dce9f0507d97958a0fcac77ab9c4eb4e831bb83a/height=288;version=1;width=512/https%3A%2F%2Fstat.ameba.jp%2Fuser_images%2F20101213%2F10%2Ftsq%2F38%2F7b%2Fp%2Fo0320048010914994759.png)