rem.js

代码如下：

(function (doc, win) {

    var docEl = doc.documentElement,

        resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',

        recalc = function () {

            var clientWidth = docEl.clientWidth;

            if (!clientWidth) return;

                docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';

            };

            if (!doc.addEventListener) return;

            win.addEventListener(resizeEvt, recalc, false);

            doc.addEventListener('DOMContentLoaded', recalc, false);

})(document, window);

在手机分辨率宽为320时， 1rem 为 20px

 

orientationChange事件（iphone 横屏）

 

这个事件是苹果公司为safari中添加的。以便开发人员能够确定用户何时将设备由横向查看切换为纵向查看模式。

在设备旋转的时候，会触发这个事件