陀螺仪

一、事件:devicemotion(检测手机晃动)

   对象:  -accelerationIncludingGravity加速度
   对象的属性:
        -x x方向速度
        -y y方向加速度
        -z z方向加速度

陀螺太过灵敏时,一般用Math.round();取其整数位。

陀螺仪的兼容性问题:在ios和Android中重力加速度值相反。需要手动解决其兼容性。

var u=navigator.userAgent;//获取userAgent,userAgent中含浏览器信息
var isAndroid=u.indexOf('Android')>-1||u.indexOf('Adr')>-1;//判断是否是android
var isIOS=!!u.match(/\(i[^;]+;(u;)?CPU.+Mac OS X/);判断是否是ios

也可以封装一个函数出来:

function getAdr(){//android:true;ios:false;
   var u=navigator.userAgent;//获取userAgent,userAgent中含浏览器信息
return u.indexOf('Android')>-1||u.indexOf('Adr')>-1;//判断是否是android
}

二、事件:orientationchange(横竖屏切换)

每次横竖屏切换都会触发该事件。

获取当前屏幕状态(横屏或者竖屏),需要检测以下对象。
window下的对象:
window.orientation
//横屏状态:90 -90
//竖屏状态:0 -180

用途:横竖屏检测
回顾:采用媒询也可以实现横竖屏检测,其原理是利用屏幕可视区宽高比检测横竖屏状态。但是该情况存在bug,输入法键盘窗口弹出影响了可视区宽高比可能会引起横竖屏切换。

问题一:怎样保证仅竖屏显示?
解决方法:因为在js中无法禁止横竖屏切换,因此可以在发生横竖屏切换时,用js控制同方向旋转屏幕内容。注意导航栏也要旋转。

二、事件:deviceorientation(检测手机倾斜旋转)

        事件对象的属性:
        -alpha(rotateZ)
        -beta(rotateX)
        -gamma(rotateY)

你可能感兴趣的:(陀螺仪)