HTML5手机摇一摇抽奖代码

手机网页的重力摇一摇抽奖，玩法够新颖，交互感也挺强。用的是 HTML5 的Device Orientation API，能读手机的加速度和方向变化。简单说，就是你摇一下手机，页面就能响应，触发抽奖流程。

监听方式也直白，直接用window.addEventListener('deviceorientation')就行了。读取event.accelerationIncludingGravity里的x、y、z值来判断是不是在“摇”。

判断逻辑你可以设个阈值，比如连续帧里加速度变化量大于一定值就算摇到了，再调用抽奖函数，像startDraw()这种就可以弹窗、动画、接口求之类的事。

用起来比较适合微信内嵌页、活动页、H5 小游戏那种，配合点音效和反馈，用户参与感挺高的。就是要注意下兼容性，有些浏览器或者低端安卓不一定支持，记得加下检测。

你要是想深入了解，还可以看看下面这几个参考，基本都是围绕这个思路扩展的，像颜色切换、音乐、甚至仿微信摇一摇那种。