rem.js

响应式设置 rem。宽度 750 px 中的设计稿中的 100px 为 1rem。

;(function () {
  var win = window
  var doc = win.document
  var docEl = doc.documentElement
  var tid
  function refreshRem () {
    // console.log('refresh rem')
    var width = docEl.getBoundingClientRect().width
    if (width > 540) {
      // 最大宽度
      width = 540
    }
    var rem = width / 7.5
    docEl.style.fontSize = rem + 'px'
  }
  win.addEventListener(
    'resize',
    function () {
      clearTimeout(tid)
      tid = setTimeout(refreshRem, 300)
    },
    false
  )
  win.addEventListener(
    'pageshow',
    function (e) {
      if (e.persisted) {
        clearTimeout(tid)
        tid = setTimeout(refreshRem, 300)
      }
    },
    false
  )
  refreshRem()
})()
export default {}