在移动html 5上检测水平倾斜

时间:2014-08-26 11:04:33

标签: javascript html5 mobile

当水平显示的移动设备左侧向后倾斜并且右侧向后倾斜时,我需要检测html5 / javascript。下面是我的代码到目前为止,但我不相信它是最好的方法。我正在使用此代码http://www.html5rocks.com/en/tutorials/device/orientation/deviceorientationsample.html

  var firstBeta = null;
        var leftAngle;
        var rightAngle;

        function init() {
            if (window.DeviceOrientationEvent) {

                // Listen for the deviceorientation event and handle the raw data
                window.addEventListener('deviceorientation', function(eventData) {

                    var tiltFB = Math.round(eventData.beta);
                    if (firstBeta == null) {
                        firstBeta = tiltFB;
                        leftAngle = tiltFB + 20;
                        rightAngle = tiltFB - 20;

                    }

                    if (tiltFB > leftAngle) {
                        document.getElementById("raw").innerHTML = "left";
                    }
                    else if (tiltFB < rightAngle) {
                        document.getElementById("raw").innerHTML = "right";
                    }
                    else
                    {
                        document.getElementById("raw").innerHTML = "center";
                    }


                    //document.getElementById("raw").innerHTML = "actual beta: " + tiltFB + " compared to first: " + ((firstBeta + 20) > tiltFB ? "left" : (firstBeta - 20) < tiltFB ? "right" : "center");


                }, false);
            }
        }

0 个答案:

没有答案