html手机陀螺儀页面,详解html5如何获取手机陀螺仪角度信息的示例代码

html5事件中，deviceorientation事件，此事件是检测设备方向变化时的事件。其常用属性为alpha(x)、beta(y)、gamma(z)。

默认将手机垂直，且正面(90度)冲着自己

alpha：左右旋转

beta：前后旋转

gamma：扭转(自转)

DeviceOrientationEvent

content="width=device-width,

initial-scale=1.0,

minimum-scale=1.0,

maximum-scale=1.0,

user-scalable=no">

try {

var text = "";

window.addEventListener("deviceorientation", orientationHandler, false);

function orientationHandler(event) {

text = ""

var arrow = document.getElementById("arrow");

text += "左右旋转：rotate alpha{" + Math.round(event.alpha) + "deg)

";

text += "前后旋转：rotate beta{" + Math.round(event.beta) + "deg)

";

text += "扭转设备：rotate gamma{" + Math.round(event.gamma) + "deg)

";

arrow.innerHTML = text;

}

}

catch (e) {

$("#arrow").html(e.message)

}