1 <html> 2 <head> 3 <title>DeviceOrientationEvent</title> 4 <meta charset="UTF-8" /> 5 </head> 6 <body> 7 <p>左右：<span id="alpha">0</span></p> 8 <p>前后：<span id="beta">0</span></p> 9 <p>扭转：<span id="gamma">0</span></p> 10 <p>指北针指向：<span id="heading">0</span>度</p> 11 <p>指北针精度：<span id="accuracy">0</span>度</p> 12 <script type="text/javascript"> 13 function orientationHandler(event) { 14 document.getElementById("alpha").innerHTML = event.alpha; 15 document.getElementById("beta").innerHTML = event.beta; 16 document.getElementById("gamma").innerHTML = event.gamma; 17 document.getElementById("heading").innerHTML = event.webkitCompassHeading; 18 document.getElementById("accuracy").innerHTML = event.webkitCompassAccuracy; 19 } 20 21 if (window.DeviceOrientationEvent) { 22 window.addEventListener("deviceorientation", orientationHandler, false); 23 } else { 24 document.body.innerHTML = "What user agent u r using???"; 25 } 26 </script> 27 </body> 28 </html>