本文主要介绍了HTML5在手机抖动中的作用。在本文中，我们使用了HTML5的移动方向deviceorientation监测传感器的数据和实现的功能摇一摇。





HTML5的一个重要特征是deviceorientation，它封装了方向传感器和运动传感器的底部为DOM事件的支持。这一特征包括两事件：

1、deviceorientation：封装方向传感器数据的事件，我们可以在静态手机定向数据，如角、方位和方向的移动电话。

2、devicemotion：的运动传感器数据的事件是封装的，而手机的移动状态下的运动加速度的数据可以得到。使用它，我们可以很容易地实现诸如重力感应、指南针等有趣的功能。它会在手机上是非常有用的。例如，在歌剧H5体验的重力感应球的例子是聆听deviceorientation的deviceorientation事件API实现的。它还可以帮助我们在网页上的手机应用实现一个非常常见的时尚特征：手机震动。

DeviceMotionEvent（装置运动事件）返回装置具有加速度和旋转加速度信息，数据将包含三个轴：X、Y和Z.（如下图所示，X轴的横向移动手机或笔记本键盘，Y轴穿过屏幕的手机或笔记本电脑的键盘上，Z轴垂直于移动手机屏幕或笔记本键盘）。因为某些设备可能不具备硬件排除重力的影响。该活动将返回两个属性，accelerationincludinggravity（重力加速度）和加速度（加速度），其中不包括重力的影响。

1。{监视运动感应事件
2。{ { }求重力加速度
三.{代码实现的核心方法

HTML5的一个重要特征是deviceorientation，它封装了方向传感器和运动传感器的底部为DOM事件的支持。这一特征包括两事件：

1、deviceorientation：封装方向传感器数据的事件，我们可以在静态手机定向数据，如角、方位和方向的移动电话。

2、devicemotion：的运动传感器数据的事件是封装的，而手机的移动状态下的运动加速度数据可以获得。
使用它，我们可以很容易地实现感兴趣的功能，如重力感应，指南针，等等。它会在手机上是非常有用的。例如，在歌剧H5体验的重力感应球的例子是通过听deviceorientation
deviceorientation事件API的实现。

它还可以帮助我们在一个网页上的手机应用程序中实现一个非常普遍和时髦的特性：手机在抖动。

DeviceMotionEvent（装置运动事件）返回装置具有加速度和旋转加速度信息，数据将包含三个轴：X、Y和Z.（如下图所示，X轴的横向移动手机或笔记本键盘，Y轴穿过屏幕的手机或笔记本电脑的键盘上，Z轴垂直于移动手机屏幕或笔记本键盘）。因为某些设备可能不具备硬件排除重力的影响。该活动将返回两个属性，accelerationincludinggravity（重力加速度）和加速度（加速度），其中不包括重力的影响。


1。{监视运动感应事件

复制代码代码如下所示：
如果（窗口。devicemotionevent）{
Window.addEventListener（&lsquo；devicemotionrsquo；devicemotionhandler，假）；
}

2。{ { }求重力加速度

复制代码代码如下所示：
功能devicemotionhandler（EVENTDATA）{
VaR加速度= eventdata.accelerationincludinggravity；
}

三.{代码实现的核心方法

复制代码代码如下所示：
无功shake_threshold = xxx；
无功last_update = 0；
变量x，y，z，last_x，last_y，last_z；
功能devicemotionhandler（EVENTDATA）{
VaR加速度= eventdata.accelerationincludinggravity；
无功curtime = newdate（）GetTime（）；
如果（（curtime ndash；最后更新）> 100）{
VaR difftime = curtime - last_update；
last_update = curtime；
x =加速度；
y =加速度；
z =加速度；
速度= math.abs（X + Y + Z ndash；last_x ndash；last_y ndash；last_z） / 10000；
如果（速度> shake_threshold）{
警报（摇！
}
last_x = x；
last_y = Y；
last_z = Z；
}
}