rem.js 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. ! function(win) {
  2. function resize() {
  3. var deviceWidth = document.documentElement.clientWidth;
  4. if(deviceWidth > 750) deviceWidth = 750;
  5. document.documentElement.style.fontSize = Math.floor(deviceWidth / 7.5) + 'px';
  6. }
  7. var v, initial_scale, timeCode, dom = win.document,
  8. domEle = dom.documentElement,
  9. viewport = dom.querySelector('meta[name="viewport"]'),
  10. flexible = dom.querySelector('meta[name="flexible"]');
  11. if(viewport) {
  12. //viewport:
  13. var o = viewport.getAttribute("content").match(/initial\-scale=(["']?)([\d\.]+)\1?/);
  14. if(o) {
  15. initial_scale = parseFloat(o[2]);
  16. v = parseInt(1 / initial_scale);
  17. }
  18. } else {
  19. if(flexible) {
  20. var o = flexible.getAttribute("content").match(/initial\-dpr=(["']?)([\d\.]+)\1?/);
  21. if(o) {
  22. v = parseFloat(o[2]);
  23. initial_scale = parseFloat((1 / v).toFixed(2))
  24. }
  25. }
  26. }
  27. if(!v && !initial_scale) {
  28. var n = (win.navigator.appVersion.match(/android/gi), win.navigator.appVersion.match(/iphone/gi));
  29. v = win.devicePixelRatio;
  30. v = n ? v >= 3 ? 3 : v >= 2 ? 2 : 1 : 1, initial_scale = 1 / v
  31. }
  32. //没有viewport标签的情况下
  33. if(domEle.setAttribute("data-dpr", v), !viewport) {
  34. if(viewport = dom.createElement("meta"), viewport.setAttribute("name", "viewport"), viewport.setAttribute("content", "initial-scale=" + initial_scale + ", maximum-scale=" + initial_scale + ", minimum-scale=" + initial_scale + ", user-scalable=no"), domEle.firstElementChild) {
  35. domEle.firstElementChild.appendChild(viewport)
  36. } else {
  37. var m = dom.createElement("div");
  38. m.appendChild(viewport), dom.write(m.innerHTML)
  39. }
  40. }
  41. win.dpr = v;
  42. win.addEventListener("resize", function() {
  43. clearTimeout(timeCode), timeCode = setTimeout(resize, 300)
  44. }, false);
  45. win.addEventListener("pageshow", function(b) {
  46. b.persisted && (clearTimeout(timeCode), timeCode = setTimeout(resize, 300))
  47. }, false);
  48. /* 个人觉得没必要完成后就把body的字体设置为12
  49. "complete" === dom.readyState ? dom.body.style.fontSize = 12 * v + "px" : dom.addEventListener("DOMContentLoaded", function() {
  50. //dom.body.style.fontSize = 12 * v + "px"
  51. }, false);
  52. */
  53. resize();
  54. }(window);