#sharkItOff
移动端的摇一摇功能
本项目需要在手机上测试
在项目中我们经常看到摇一摇功能,今天刚好用到
做了一个总结:使用howler.js音频处理
可以访问:http://goldfirestudios.com/blog/104/howler.js-Modern-Web-Audio-Javascript-Library了解更多
“摇一摇”的动作即“一定时间内设备移动了一定的距离”,
因此通过监听上一步获取到的x, y, z 值在一定时间范围内的变化率,即可进行设备是否有进行晃动的判断。
而为了防止正常移动的误判,需要给该变化率设置一个合适的临界值。
摇一摇使用到的API(希望可以研究一下)(HTML5新特性移动设备的API)
deviceOrientation:
封装了方向传感器数据的事件,可以获取手机静止状态下的方向数据,例如手机所处角度、方位、朝向等
deviceMotion:
封装了运动传感器数据的事件,可以获取手机运动状态下的运动加速度等数据,
使用它我们能够很容易的实现重力感应、指南针等有趣的功能,在手机上将非常有用.
DeviceMotionEvent:
(设备运动事件)返回设备有关于加速度和旋转的相关信息,加速度的数据将包含三个轴:x,y和z
(x轴横向贯穿手机屏幕或者笔记本键盘,y轴纵向贯穿手机屏幕或笔记本键盘,z轴垂直于手机屏幕或笔记本键盘)
因为有些设备可能没有硬件来排除重力的影响,该事件会返回两个属性,
accelerationIncludingGravity:
(含重力的加速度)和acceleration(加速度),后者排除了重力的影响
注意:更多请参考项目中的注释很清晰的奥(js/shake.js)
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。