1 <audio id="chatAudio" src="__STATIC__/wweb/img/red-01.mp3" style="display:none;"></audio>
2 <audio id="openAudio" src="__STATIC__/wweb/img/red-02.mp3" style="display:none;"></audio>
3
4 <div id="yyy" class="animated"><img src="__STATIC__/wweb/img/yy.png" /></div>
5
6 <div id="qian" class="animated"><a href="/wweb/index/qian?id=4"><img src="__STATIC__/wweb/img/qian.png" /></a></div>
7
8
9 <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
10 <script type="text/javascript">
11 <!--
12 var yyck = true;
13 var audio=document.getElementById("chatAudio");
14 var openAudio=document.getElementById("openAudio");
15 document.addEventListener("WeixinJSBridgeReady", function () {
16 audio.load();
17 openAudio.load();
18 }, false);
19
20 //运动事件监听
21 if (window.DeviceMotionEvent) {
22 window.addEventListener('devicemotion',deviceMotionHandler,false);
23 }
24 //获取加速度信息
25 //通过监听上一步获取到的x, y, z 值在一定时间范围内的变化率,进行设备是否有进行晃动的判断。
26 //而为了防止正常移动的误判,需要给该变化率设置一个合适的临界值。
27 var SHAKE_THRESHOLD = 4000;
28 var last_update = 0;
29 var x, y, z, last_x = 0, last_y = 0, last_z = 0;
30 function deviceMotionHandler(eventData) {
31 var acceleration =eventData.accelerationIncludingGravity;
32 var curTime = new Date().getTime();
33 if ((curTime-last_update)> 10) {
34 var diffTime = curTime -last_update;
35 last_update = curTime;
36 x = acceleration.x;
37 y = acceleration.y;
38 z = acceleration.z;
39 var speed = Math.abs(x +y + z - last_x - last_y - last_z) / diffTime * 10000;
40 if (speed > SHAKE_THRESHOLD) {
41 if(!yyck){return false;}
42 audio.play();
43 $('#yyy').addClass('wobble');
44 setTimeout(function(){
45 audio.pause();
46 openAudio.play();
47 $('#yyy').removeClass('wobble');
48 $('#qian').css('display','block');
49 yyck = false;
50 }, 1500);
51 }
52 last_x = x;
53 last_y = y;
54 last_z = z;
55 }
56 }
57 //-->
58 </script>