dev-park.com博客在iOS下的根据设备的螺旋仪在rotateY的倾斜效果

transform-rotateY.js

var DeviceOrientation = (function(win){

    var targetElement = null,
        isRotate = false;

    function deviceOrientationHandler(eventData){
        var lr = -Math.round(eventData.gamma),
            maxRotateY = 15;

        // 去燥
        if(Math.abs(lr) < 5){
            if(!isRotate) { return; }
            lr = 0;
            isRotate = false;
        }else{
            isRotate = true;
        }

        // 如果大于允许的最大rotateY，则让其保持在那个方向的最大rotateY
        if(Math.abs(lr) > maxRotateY){
            lr = lr < 0 ? -maxRotateY : maxRotateY;
        }

        // For webkit
        targetElement.style.webkitTransform = "rotateY(" + lr + "deg)";
        // For HTML5 Standard
        targetElement.style.transform = "rotateY(" + lr + "deg)";
    }

    function init(element){
        if(!window.DeviceOrientationEvent){ return; }
        targetElement = element;
        window.addEventListener('deviceorientation', deviceOrientationHandler ,false);
    }

    return {
        init : init
    }
})(window);

// Usage
$(window).load(function(){
    DeviceOrientation.init($("#blog").get(0));
});