H5页面实现摇一摇并震动【花花教程】.docx

H5页面实现摇一摇并震动【花花教程】<!-记住引用jQuery.js-><script>varspeed=IO;定义摇一摇加速度的临界值值越小摇动的力度越小varX=y=z=IastX=IastY=IastZ=0;初始化x,y,z上加速度的默认值varisHaveShaked=faIse;用于记录是否在动画执行中functioninit()判断系统是否支持html5摇一摇的相关属性if(window.DeviceMotionEvent)window.addEventListenerCdevicemotion',deviceMotionHandlerzfalse);elsealert('notsupportmobileevent');)functiondeviceMotionHandler()*获取,y,z方向的即时加速度*/varacceleration=event.accelerationlncludingGravity;x=acceleration.×y=acceleration.y;z=acceleration.z;if(Math.abs(x-IastX)>speedMath.abs(y-IastY)>speedHMath.abs(z-IastZ)>speed)摇一摇实际场景就是加速度的瞬间暴增爆减if(!isHaveShaked)alert(x);自己测试各坐标的值。alert(y)alert(z);手机震动1秒if(navigator.vibrate)navigator.vibrate(1000);震动1000毫秒elseif(navigator.webkitVibrate)navigator.webkitVibrate(1000);)模拟网络请求做想干的事isHaveShaked=true;setTimeout(function()isHaveShaked=false;/.l2000);)*保存历史加速度*/IastX=x;IastY=y;IastZ=z;)$(function()init();)；<script>