Home > Web Front-end > JS Tutorial > js shake your phone

js shake your phone

巴扎黑
Release: 2016-12-19 14:13:36
Original
1571 people have browsed it

The last time I was playing a mobile game, I saw a shake lottery. The game is made on the web, so I found some code on the Internet to implement the JS shake function.

The specific content is not explained in detail, so just code it

HTML Code

<audio id="musicBox" src=""></audio>
Copy after login

JS code

init();
var SHAKE_THRESHOLD = 3000;
var last_update = 0;
var x = y = z = last_x = last_y = last_z = 0;
function init() {
   if (window.DeviceMotionEvent) {
       window.addEventListener(&#39;devicemotion&#39;, deviceMotionHandler, false);
   } else {
       alert(&#39;not support mobile event&#39;);
   }
}
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("感觉到摇动,我要发射了");
           var media = document.getElementById("musicBox"); //获取音频控件
           media.setAttribute("src", "imgy/shake_sound.mp3");
           media.load(); //加载音频
           media.play(); //播放音频 
       }
       last_x = x;
       last_y = y;
       last_z = z;
   }
}
Copy after login


Related labels:
js
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template