html5判断设备的动作
相应的事件
deviceorientation事件提供设备的物理方向信息,表示为一系列本地坐标系的旋角。
devicemotion事件提供设备的加速信息,表示为定义在设备上的坐标系中的卡尔迪坐标。其还提供了设备在坐标系中的自转速率。若可行的话,事件应该提供设备重心处的加速信息。
compassneedscalibration事件用于通知Web站点使用罗盘信息校准上述事件。
这几个事件在比较老的ios和安卓系统上都支持。
在学习之前需要先对相应的坐标有一个槪念
x、y、z轴示意图

deviceorientation事件的event对象有如下属性:
alpha:手机左右晃动(即围绕z轴旋转),y轴的度数差:0到360度
beta:手机前后晃动(即靠近自己或远离自己,围绕x轴旋转),z轴的度数差:-180到180度
game:手机扭转(即围绕y轴旋转),z轴的度数差:-90到90度

deviceorientation事件的event对象有如下属性:
acceleration 设备在X,Y,Z轴方向上加速度的对象。加速度的单位为 m/s2。
accelerationIncludingGravity 设备在X,Y,Z轴方向上带重力的加速度的对象。加速度的单位为 m/s2
rotationRate 设备在 alpha,beta, gamma轴方向上旋转的速率的对象。旋转速率的单位为 ?°/s 。
interval 设备获取数据的频率,单位是毫秒。
将设备放置在水平表面,屏幕向上,acceleration为零,则其accelerationIncludingGravity信息如下:
{x: 0,y: 0,z: 9.81};
设备做自由落体,屏幕水平向上,accelerationIncludingGravity为零,则其acceleration信息如下:
{x: 0, y: 0,z: -9.81};
将设备安置于车辆至上,屏幕处于一个垂直平面,顶端向上,面向车辆后部。车辆行驶速度为v,向右侧进行半径为r的转弯。设备记录acceleration和accelerationIncludingGravity在位置x处的情况,同时设备还会记录rotationRate.gamma的负值:
{acceleration: {x: v^2/r, y: 0, z: 0},
accelerationIncludingGravity: {x: v^2/r, y: 0, z: 9.81},
rotationRate: {alpha: 0, beta: 0, gamma: -v/r*180/pi} };
html5判断设备的动作的更多相关文章
- HTML5判断设备在线离线及监听网络状态变化例子
经测试android ipad默认的浏览器支持,用appcan封装的网页也支持 本文原创,转载请说明出处 <!doctype html> <html> <head> ...
- HTML5外包团队——技术分享:HTML5判断设备在线离线及监听网络状态变化例子
<!doctype html> <html> <head> <meta http-equiv="content-type" content ...
- HTML5摇一摇(上)—如何判断设备摇动
刚刚过去的一年里基于微信的H5营销可谓是十分火爆,通过转发朋友圈带来的病毒式传播效果相信大家都不太陌生吧,刚好最近农历新年将至,我就拿一个"摇签"的小例子来谈一谈HTML5中如何调 ...
- html5判断用户摇晃了手机(转)
先来看下html5的这几个特性: 1.deviceOrientation:方向传感器数据的事件,通过监听该事件可以获取手机静态状态下的方向数据: 2.deviceMotion: 运动传感器数据事件,通 ...
- 利用HTML5判断用户是否正在浏览页面技巧
现在,HTML5里页面可见性接口就提供给了程序员一个方法,让他们使用visibilitychange页面事件来判断当前页面可见性的状态,并针对性的执行某些任务.同时还有新的document.hidde ...
- IOS判断设备是否已越狱
转自:http://www.cnblogs.com/supercheng/archive/2012/12/05/2804166.html - (BOOL)isJailbroken { BOOL jai ...
- 用indexOf判断设备
通过userAgent去判断,先判断是否为移动端,可以判断是iOS终端和Android终端,也可以具体到应用进行判断微信,微博,qq访问. <!DOCTYPE html> <html ...
- 用indexOf判断设备是否是PC端?
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JS判断设备终端(PC,iPad,iPhone,android,winPhone)和浏览器
JS判断设备终端(PC,iPad,iPhone,android,winPhone)和浏览器 var ua = navigator.userAgent; var browser = {}, weixin ...
随机推荐
- 【[SDOI2016]排列计数】
一眼题,答案就是\(C_m^m*d_{n-m}\) 就是从\(n\)个中选取\(m\)个在位,剩下的错排,之后就是乘法原理了 但是我发现我的错排公式竟然一直不会推 这个递推式很简单,就是\(d[1]= ...
- 【转】总结oninput、onchange与onpropertychange事件的用法和区别
经本人测试在chrome下的从历史记录中选取值的时候也户触发input事件 前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过 ...
- 超简单,快速修改Oracle10g的默认8080端口
因为Oracle数据库默认的端口是8080,这也是tomcat服务器的默认端口. 为了避免端口冲突,我们通常会修改掉其中一个. 这里我们选择修改Oracle数据库的端口. 第一步:以管理员身份运行cm ...
- mybatis学习记录四——输入、输出映射
6 输入映射 通过parameterType指定输入参数的类型,类型可以是简单类型.hashmap.pojo的包装类型. 6.1.1 需求 完成用户信息的综合查询,需要传入查询条件很 ...
- P4722 【模板】最大流
P4722 [模板]最大流 加强版 / 预流推进 今日心血来潮,打算学习hlpp 然后学了一阵子.发现反向边建错了.容量并不是0.qwq 然后就荒废了一晚上. 算法流程的话.有时间补上 #includ ...
- 【洛谷P3119】[USACO15JAN]草鉴定Grass Cownoisseur
草鉴定Grass Cownoisseur 题目链接 约翰有n块草场,编号1到n,这些草场由若干条单行道相连.奶牛贝西是美味牧草的鉴赏家,她想到达尽可能多的草场去品尝牧草. 贝西总是从1号草场出发,最后 ...
- 【luogu P2863 [USACO06JAN]牛的舞会The Cow Prom】 题解
题目链接:https://www.luogu.org/problemnew/show/P2863 求强连通分量大小>自己单个点的 #include <stack> #include ...
- Win7下运行VC程序UAC权限问题 VC2010设置UAC权限方法
https://msdn.microsoft.com/en-us/library/bb756929.aspx 我使用的是VS2010,设为连接器清单文件的uac执行级别 直接项目右键---属性---配 ...
- ng-repeat 指令(带有数组)
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- JS JavaScript中的文档碎片 DocumentFragement JS性能优化
文档碎片是什么: 如果我们要在一个ul中添加100个li,如果不使用文档碎片,那么我们就需要使用append经常100次的追加,这会导致浏览器一直不停的渲染,是非常消耗资源的.但是如果我们使用文档碎片 ...