关于移动端页面强制竖屏的方法

function orient() {
            if(window.orientation == 90 || window.orientation == -90) {//横屏
                //ipad、iphone竖屏；Andriod横屏
                //$("body").attr("class", "landscape");
                //orientation = 'landscape';
                //alert("ipad、iphone竖屏；Andriod横屏");
                $("p").text("横屏");
                return false;
            } else if(window.orientation == 0 || window.orientation == 180) {//竖屏
                //ipad、iphone横屏；Andriod竖屏
//                $("body").attr("class", "portrait");
//                orientation = 'portrait';
                //alert("ipad、iphone横屏；Andriod竖屏");
                $("p").text("竖屏");
                return false;
            }
        }
        //页面加载时调用
        $(function() {
            orient();
        });
        //用户变化屏幕方向时调用
        $(window).on('orientationchange', function(e) {
            
            orient();
            
        });

// 利用 CSS3 旋转 对根容器逆时针旋转 90 度 强制用户进行竖屏显示
var detectOrient = function() {
    var width = document.documentElement.clientWidth,
        height = document.documentElement.clientHeight,
        //$wrapper = document.getElementsByTagName("body")[0],
        $wrapper = document.getElementById("vue"),
        style = "";
    if(width <= height) { // 横屏
//        style += "width:" + width + "px;"; // 注意旋转后的宽高切换
//        style += "height:" + height + "px;";
//        style += "-webkit-transform: rotate(0); transform: rotate(0);";
//        style += "-webkit-transform-origin: 0 0;";
//        style += "transform-origin: 0 0;";
        style += "font-size:" + (width * 100 / 1125) + "px";
        var html_doc = document.getElementsByTagName("html")[0];
        html_doc.style.cssText = "font-size:" + (width * 100 / 1125) + "px";
    } else { // 竖屏
        style += "width:" + height + "px;";
        style += "min-height:" + width + "px;";
        style += "-webkit-transform: rotate(-90deg); transform: rotate(-90deg);";
        // 注意旋转中点的处理
        style += "-webkit-transform-origin: " + height / 2 + "px " + (height / 2) + "px;";
        style += "transform-origin: " + height / 2 + "px " + (height / 2) + "px;";
        //style += "font-size:" + height * 100 / 1125 + "px;";
        //$("html").css({"font-size":(height * 100 / 1125),"overflow-y":"hidden"});
        var html_doc = document.getElementsByTagName("html")[0];
        html_doc.style.cssText = "font-size:" + height * 100 / 1125 + "px;" + "overflow-y:"+"hidden;"+"height:"+height+"px;";
        style += "overflow-y: hidden;";
        add_tab();
        $wrapper.style.cssText = style;
    }
    
    
}
window.onresize = detectOrient;
detectOrient();

function add_tab(){
    var clone_tab = $("footer").clone();
    $("footer").remove();
    clone_tab.css({"transform":"rotate(-90deg)","transform-origin":"top right"})
    $("body").append(clone_tab);
    clone_tab.css({"position":"fixed","right":"1.77rem","bottom":"4rem","left":"auto","top":"0","width":"11.25rem","height":"1.77rem"})
}