h5 js DeviceMotionEvent 摇一摇代码

h5 js DeviceMotionEvent 摇一摇代码
全网最全的h5摇一摇源码
```
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="format-detection" content="telephone=no">
	<meta http-equiv="x-rim-auto-match" content="none">
	<title>摇一摇</title>
</head>
<body>
	<div>开始摇一摇吧 </div>
	<div>摇一摇次数：<span id="y_id">0</span></div>
<script type="text/javascript">

// 定义一个摇动的阈值:为了防止正常移动的误判，需要给该变化率设置一个合适的临界值
  var shakeThreshold = 500;
  // 记录上一次摇动的时间
  var lastUpdate = 0;
  // 定义x、y、z记录三个轴的数据以及上一次触发的数据
  var x, y, z, lastX, lastY, lastZ;

// 监听传感器运动事件
  if (window.DeviceMotionEvent) {
  	alert('123');
    window.addEventListener('devicemotion', deviceMotionHandler, false);
  } else {
    alert('本设备不支持devicemotion事件');
  }

// 运动传感器处理
  function deviceMotionHandler(e) {
    // 获取含重力的加速度
    var acceleration = e.accelerationIncludingGravity;
    var curTime =Date.now();

// 100毫秒进行一次位置判断
    if ((curTime - lastUpdate) > 100) {

var diffTime = curTime - lastUpdate;
      lastUpdate = curTime;

x = acceleration.x;
      y = acceleration.y;
      z = acceleration.z;

var speed = Math.abs(x + y + z - lastX - lastY - lastZ) / diffTime * 10000;
      // 前后x, y, z间的差值的绝对值和时间比率超过了预设的阈值，则判断设备进行了摇晃操作
      if (speed > shakeThreshold) {
        // doSomething();
        // alert('一起摇摆');
        var a = document.getElementById("y_id").innerText;
        let number = parseInt(a) + 1
        document.getElementById("y_id").innerHTML = number
        if (number>20) {
        	alert('被你摇坏了');
        }
        window.location.href = 'tel:4000-000-000';
      }

lastX = x;
      lastY = y;
      lastZ = z;
    }
  }
</script>
	
</body>
</html>
```

土豆·方便面

家腾网

《h5 js DeviceMotionEvent 摇一摇代码》上暂无评论!

发布您对《 h5 js DeviceMotionEvent 摇一摇代码》的评论吧！

《h5 js DeviceMotionEvent 摇一摇代码》上暂无评论!

发布您对 《 h5 js DeviceMotionEvent 摇一摇代码 》的评论吧！

发布您对《 h5 js DeviceMotionEvent 摇一摇代码》的评论吧！