config.js 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940
  1. // 计算当前html的font-size值 (移动端)
  2. // (function (doc, win) {
  3. // var docEl = doc.documentElement,
  4. // resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
  5. // recalc = function () {
  6. // var clientWidth = docEl.clientWidth;
  7. // if (!clientWidth) return;
  8. // docEl.style.fontSize = 100 * (clientWidth / 375) + 'px';
  9. // };
  10. // if (!doc.addEventListener) return;
  11. // win.addEventListener(resizeEvt, recalc, false);
  12. // doc.addEventListener('DOMContentLoaded', recalc, false);
  13. // })(document, window);
  14. // 设置 rem 函数 (pc端)
  15. function setRem () {
  16. // PC端
  17. console.log('非移动设备')
  18. // 基准大小
  19. baseSize = 100;
  20. let basePc = baseSize / 1920; // 表示1920的设计图,使用100PX的默认值
  21. let vW = window.innerWidth; // 当前窗口的宽度
  22. let vH = window.innerHeight; // 当前窗口的高度
  23. // 非正常屏幕下的尺寸换算
  24. let dueH = vW * 1080 / 1920
  25. if (vH < dueH) { // 当前屏幕高度小于应有的屏幕高度,就需要根据当前屏幕高度重新计算屏幕宽度
  26. vW = vH * 1920 /1080
  27. }
  28. let rem = vW * basePc; // 以默认比例值乘以当前窗口宽度,得到该宽度下的相应font-size值
  29. document.documentElement.style.fontSize = rem + "px";
  30. }
  31. // 初始化
  32. setRem();
  33. // 改变窗口大小时重新设置 rem
  34. window.onresize = function () {
  35. setRem()
  36. };