h5-add/js/layout.js

var adaptUILayout = (function() {
    //根据校正appVersion或userAgent校正屏幕分辨率宽度值
    var regulateScreen = (function() {
        var cache = {};
        //默认尺寸
        var defSize = {
            width: window.screen.width,
            height: window.screen.height
        };
        var ver = window.navigator.appVersion;
        var _ = null;
        var check = function(key) {
            return key.constructor == String ? ver.indexOf(key) > -1 : ver.test(key);
        };

        var add = function(name, key, size) {
            if (name && key)
                cache[name] = {
                    key: key,
                    size: size
                };
        };

        var del = function(name) {
            if (cache[name])
                delete cache[name];
        };

        var cal = function() {
            if (_ != null)
                return _;
            for (var name in cache) {
                if (check(cache[name].key)) {
                    _ = cache[name].size;
                    break;
                }
            }
            if (_ == null)
                _ = defSize;
            return _;
        };

        return {
            add: add,
            del: del,
            cal: cal
        };
    })();

    //实现缩放
    var adapt = function(uiWidth) {
        var
            deviceWidth,
            devicePixelRatio,
            targetDensitydpi,
            //meta,
            initialContent,
            head,
            viewport,
            ua;

        ua = navigator.userAgent.toLowerCase();
        //whether it is the iPhone or iPad
        isiOS = ua.indexOf('ipad') > -1 || ua.indexOf('iphone') > -1;

        //获取设备信息,并矫正参数值
        devicePixelRatio = window.devicePixelRatio;
        deviceWidth = regulateScreen.cal().width;

        //获取最终dpi
        targetDensitydpi = uiWidth / deviceWidth * devicePixelRatio * 160;

        //use viewport width attribute on the iPhone or iPad device
        //use viewport target-densitydpi attribute on the Android device
        initialContent = isiOS ?
            'width=' + uiWidth + ', user-scalable=no' :
            'target-densitydpi=' + targetDensitydpi + ', width=' + uiWidth + ', user-scalable=no';

        //add a new meta node of viewport in head node
        head = document.getElementsByTagName('head');
        viewport = document.createElement('meta');
        viewport.name = 'viewport';
        viewport.content = initialContent;
        head.length > 0 && head[head.length - 1].appendChild(viewport);
    };
    return {
        regulateScreen: regulateScreen,
        adapt: adapt
    };
})();
/*
 *375为当期页面指定的统一分辨率，其他分辨率下均为此分辨率的放缩变化
 */
adaptUILayout.adapt(375);


//rem初始化代码

/*function adapt(designWidth, rem2px){
  var d = window.document.createElement('div');
  d.style.width = '1rem';
  d.style.display = "none";
  var head = window.document.getElementsByTagName('head')[0];
  head.appendChild(d);
  var defaultFontSize = parseFloat(window.getComputedStyle(d, null).getPropertyValue('width'));
  d.remove();
  document.documentElement.style.fontSize = window.innerWidth / designWidth * rem2px / defaultFontSize * 100 + '%';
  var st = document.createElement('style');
  var portrait = "@media screen and (min-width: "+window.innerWidth+"px) {html{font-size:"+ ((window.innerWidth/(designWidth/rem2px)/defaultFontSize)*100) +"%;}}";
  var landscape = "@media screen and (min-width: "+window.innerHeight+"px) {html{font-size:"+ ((window.innerHeight/(designWidth/rem2px)/defaultFontSize)*100) +"%;}}"
  st.innerHTML = portrait + landscape;
  head.appendChild(st);
  return defaultFontSize
};
var defaultFontSize = adapt(640, 100);
*/

//H5翻转屏幕事件
/*function orientationChange() {
    switch(window.orientation) {
    　　case 0:
            alert("肖像模式 0,screen-width: " + screen.width + "; screen-height:" + screen.height);
            break;
    　　case -90:
            alert("左旋 -90,screen-width: " + screen.width + "; screen-height:" + screen.height);
            break;
    　　case 90:   
            alert("右旋 90,screen-width: " + screen.width + "; screen-height:" + screen.height);
            break;
    　　case 180:
        　　alert("风景模式 180,screen-width: " + screen.width + "; screen-height:" + screen.height);
        　　break;
    };
};
// 添加事件监听
addEventListener('load', function(){
    orientationChange();
    window.onorientationchange = orientationChange;
});
*/