if (window.DeviceMotionEvent) {
window.addEventListener('devicemotion',deviceMotionHandler, false);
}
var speed = 30;//speed
var x = y = z = lastX = lastY = lastZ = 0;
function deviceMotionHandler(eventData) {
var acceleration =event.accelerationIncludingGravity;
x = acceleration.x;
y = acceleration.y;
z = acceleration.z;
if(Math.abs(x-lastX) > speed || Math.abs(y-lastY) > speed || Math.abs(z-lastZ) > speed) {
//简单的摇一摇触发代码
alert(1);
}
lastX = x;
lastY = y;
lastZ = z;
}

摇一摇触发事件,感觉还是蛮高大上的

html5重力感应事件的更多相关文章

  1. H5案例分享:html5重力感应事件

    html5重力感应事件 一.手机重力感应图形分析 1.设备围绕z轴的旋转角度为α,α角度的取值范围在[0,360). 设备在初始位置,与地球(XYZ)和身体(XYZ)某个位置对齐. 设备围绕z轴的旋转 ...

  2. html5重力感应事件之DeviceMotionEvent

    前言 今天主要介绍一下html5重力感应事件之DeviceMotionEvent,之前我的一篇文章http://www.haorooms.com/post/jquery_jGestures, 介绍了第 ...

  3. h5手机摇一摇功能实现:基于html5重力感应DeviceMotionEvent事件监听手机摇晃

    DeviceMotionEven是html5提供的一个用来获取设备物理方向及运动的信息(比如陀螺仪.罗盘及加速计)的Dom事件,事件描述如下: deviceorientation:提供设备的物理方向信 ...

  4. Cocos2D-X2.2.3学习笔记9(处理重力感应事件,移植到Android加入两次返回退出游戏效果)

    这节我们来学习Cocos2d-x的最后一节.怎样处理重力感应事件.移植到Android后加入再按一次返回键退出游戏等.我这里用的Android.IOS不会也没设备呃 效果图不好弄,由于是要移植到真机上 ...

  5. HTML5重力感应小球冲撞动画实现教程

    今天我们来分享一款很酷的HTML5重力感应动画教程,这款动画可以让你甩动页面中的小球,小球的大小都不同,并且鼠标点击空白区域时又可以生成一定数量的小球.当我们甩动小球时,各个小球之间就会发生互相碰撞的 ...

  6. HTML5 重力感应效果,实现摇一摇效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 移动端html5重力感应

    下面是测试案例,只测试过itouch,iphone http://06wjin.sinaapp.com/billd/     http://06wjin.sinaapp.com/billd/test. ...

  8. 移动终端学习2:触屏原生js事件及重力感应

    如今智能移动设备已经渗透到人们生活的方方面面,用户数量也在不断迅速增长(市场研究机构 eMarketer 在今年初发表的趋势报告中预测,2014年至2018年,中国智能手机用户从总人口的 38.3%增 ...

  9. html5水平方向重力感应

    html5图片随手机重力感应而移动 <!DOCTYPE html> <html lang="zh-cn"><head><meta http ...

随机推荐

  1. 【Android 错误记录】Conversion to Dalvik format failed with error 1 错误

    错误原因:依赖的包中有冲突,比如依赖了同一个jar包的不同版本等   在以往测试的过程中,出现过几次这个问题,根本原因都是因为有冲突了,但是表现形式可能不一样   情况1: 有一个叫DemoAPP的工 ...

  2. SecureCRT使用的技巧 键盘修改

    secureCRT 修改PageUP,PageDown,Home,End键小trick:http://blog.csdn.net/shark_sq/article/details/6722512 所有 ...

  3. 菜鸟的jQuery源码学习笔记(一)

    整个jQuery是一个自调用的匿名函数: (function(global, factory) { if (typeof module === "object" && ...

  4. c#局域网聊天软件的实现

    本软件是基于大学寝室局域网聊天的思路.c#源代码如下: using System; using System.Drawing; using System.Collections; using Syst ...

  5. coco2d-x中的坐标系问题

    (1)OpenGL坐标系 Cocos2D-x以OpenGL和OpenGL ES为基础,所以自然支持OpenGL坐标系.该坐标系原点在屏幕左下角,x轴向右,y轴向上. (2)屏幕坐标系 屏幕坐标系使用的 ...

  6. delphi 修改代码补全的快捷键(由Ctrl+Space 改为 Ctrl + alt + Space)(通过修改OpenTool生效)

    delphi 的IDE快捷键与输入法切换键中突,以往的解决方法是下载一个ImeTool修改 windows 系统的快捷键 在 xp win7 都好使,但在win 10经常是修改完后,重启又失效了. 本 ...

  7. java设计模式--行为型模式--迭代模式

    迭代器模式 概述 给定一个语言,定义它的文法的一种表示,并定义一个解释器,这个解释器使用该表示来解释语言中的句子. 适用性 .访问一个聚合对象的内容而无需暴露它的内部表示. .支持对聚合对象的多种遍历 ...

  8. 学习笔记之--java EE 环境的搭建

    一.前期准备.(apache-maven-3.0.5.apache-tomcat-7.0.23-windows-x86.eclipse-jee-kepler-SR1-win32.jdk-7u45-wi ...

  9. OpenSuSE zypper repo及Desktop媒体播放器设置 for OpenSuSE12.

    1.禁用官方源和DVD光盘源,启用中国大陆源 使用DVD光盘安装好openSUSE 12.2之后,软件安装源中默认存在一个名称为”openSUSE-12.2-1.6″的软件源,这个源的URL实际上是指 ...

  10. apache的斜杠问题

    APACHE默认情况下,网页目录的最后必须加入斜杠“/",比如 可以浏览http://www.example.com/abc/,但是不能浏览http://www.example.com/ab ...