摇一摇js代码
init();
var SHAKE_THRESHOLD = 3000;
var last_update = 0;
var x = y = z = last_x = last_y = last_z = 0;
function init() {
if (window.DeviceMotionEvent) {
window.addEventListener('devicemotion', deviceMotionHandler, false);
} else {
alert('not support mobile event');
}
}
function deviceMotionHandler(eventData) {
var acceleration = eventData.accelerationIncludingGravity;
var curTime = new Date().getTime();
if ((curTime - last_update) > 100) {
var diffTime = curTime - last_update;
last_update = curTime;
x = acceleration.x;
y = acceleration.y;
z = acceleration.z;
var speed = Math.abs(x + y + z - last_x - last_y - last_z) / diffTime * 10000; if (speed > SHAKE_THRESHOLD) {
alert("摇动了");
media.setAttribute("src", "http://211.148.5.228:8002/Pages/test/Kalimba.mp3");
media.load();
media.play();
}
last_x = x;
last_y = y;
last_z = z;
}
}
摇一摇js代码的更多相关文章
- 使用shake.js让你博客支持摇一摇
大家好,又到了随机文章的时间,请使用手机打开演示站点,然后像摇妹子一样摇晃手机,你会发现非常牛逼的事情,炫酷吧.该功能已经集成在Oconnor1.8中.本文主要讲解这货的原理. 首先需要下载shake ...
- shake.js实现微信摇一摇功能
项目要求实现点击摇一摇图片,图片摇一摇,并且摇一摇手机,图片也要摇一摇. 关于用js怎样实现摇一摇手机图片摇一摇,我在网络上找了一些方法,真正有用的是shake.js. 接下来,上shake.js源码 ...
- js检测手机摇一摇
1.检测设备是否支持重力感应事件deviceorientation deviceorientation 提供设备的物理方向信息,表示为一系列本地坐标系的旋角 function motionHandle ...
- js html5 仿微信摇一摇
看微信摇一摇之后忽然想知道他是怎么写的.于是就在网上查了一些资料,有些是借鉴别人的.大家共同学习啊 先放代码 <body onload="init()"> <p& ...
- 几行代码实现iOS摇一摇功能
实现这个功能很简单,我们直接看代码 - (void)motionBegan:(UIEventSubtype)motion withEvent:(UIEvent *)event{ NSLog(@&quo ...
- js微信摇一摇功能以及api
一.摇一摇功能 <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
- H5+JS实现手机摇一摇功能
在做微信活动页面的时候,经常会需要实现手机摇一摇功能,比如“摇一摇,拿好礼”. 为了实现它,就需要用到HTML5的DeviceOrientation特性.它提供的DeviceMotion事件封装了设备 ...
- js摇一摇事件
今早同事过来说.要做个小游戏.里面有个摇一摇动作. 平时都是做的手机营销h5比较少. 发现很有意思. 一时间没有反应过来. 怎么实现的摇一摇. 现在吧代码叠出来给2货的我. //运动事件监听if ...
- js实现手机摇一摇
//手机摇一摇 ---------------------------------------------------------- init();var SHAKE_THRESHOLD = 3000 ...
- 用js实现摇一摇功能
function init(){ if (window.DeviceMotionEvent) { // 移动浏览器支持运动传感事件 window.addEventListener('devicemot ...
随机推荐
- CentOS6.4 安装 codeblocks-12.11
FROM: http://blog.csdn.net/theegao/article/details/8750239 一.下载 1. codeblocks-12.11-1.el6.x86_64.t ...
- 转:100.64. 开头IP地址问题
100.64. 开头IP地址问题 姚洪楼 发表于 学习备忘录 分类,标签: 电信 08二月2015 0 之前调试过一个路由器在成功设置DDNS的情况下外网依旧无法访问的情况,当时没有多想什么,一直以为 ...
- 10g full join 优化
今天一个女生咨询我报名学优化.聊着聊着就让我优化一个sql 由于怕泄密,所以删除了 sql . 不好意思 该sql是 olap 的, 在oracle10g 上面跑.跑一次要33秒钟.一般olap报表. ...
- 打造你的前端神器-webstorm11
说起前端编辑器,用过dw,sublime,hbuilder,webstorm也不陌生,之前的版本8有用过一下,但是觉得比sublime重量太多,但是随着后来用node的开始,发现需要打造个web前端神 ...
- windows新建或者重命名文件及目录必须手动刷新才干显示出来问题解决方法
首先推断注冊表中HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Control\Update\UpdateMode值是否为0,该值若为1表示手工刷新, 该 ...
- vueAdmin使用动态路由时踩坑
在路由守护方法router.beforeEach中如果有使用动态路由,注意此时的路由对当前的router无效,下次路由时才起效. 导致的问题是---- 当页面刷新或重新打开页面时,无法找到当前路由(跳 ...
- 压力测试衡量CPU的三个指标:CPU Utilization、Load Average和Context Switch Rate
分类: 4.软件设计/架构/测试 2010-01-12 19:58 34241人阅读 评论(4) 收藏 举报 测试loadrunnerlinux服务器firebugthread 上篇讲如何用LoadR ...
- Java + Selenium + Appium手机自动化测试
一.启动测试机或者Android模拟器(Genymotion俗称世界上最快的模拟器,可自行百度安装) 二.启动Appium(Appium环境安装可自行百度) 三.安装应用到Genymotion上,如下 ...
- YUV图像合成原理
http://blog.csdn.net/zwz1984/article/details/50403150 http://zhongcong386.blog.163.com/blog/static/1 ...
- Java利用Axis远程调用WebService接口
准备工作: 主要依赖的包: 1.axis.jar 官网:http://axis.apache.org/axis/ 2.jaxrpc.jar 下载地址:http://www.java2s.com/Cod ...