您的位置:首页 > Web前端 > HTML5

HTML5实现手机摇一摇的功能

2013-03-25 16:22 567 查看
前几天同事要求实现摇一摇手机上传图片的功能,到网上找了些文章看了,有些代码里是有错误的,我改了下,见下面代码,在手机浏览器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;
	}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: