HTML5实现手机摇一摇的功能

前几天同事要求实现摇一摇手机上传图片的功能,到网上找了些文章看了,有些代码里是有错误的,我改了下,见下面代码,在手机浏览器opera HD版本里测试可以。


var SHAKE_THRESHOLD = 3000;
var last_update = 0;
var x=y=z=last_x=last_y=last_z=0;
if (window.DeviceMotionEvent) {
	window.addEventListener('devicemotion',deviceMotionHandler, false);
}
else
{
	alert("本浏览器不支持HTML5摇一摇功能!");
}
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("看到我就是摇了!");
		}
		last_x = x;
		last_y = y;
		last_z = z;
	}
}


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值