码迷,mamicode.com
首页 > 其他好文 > 详细

rem适配代码

时间:2017-07-15 22:50:04      阅读:314      评论:0      收藏:0      [点我收藏+]

标签:res   var   设置   set   get   ted   nts   settime   dev   

 1 ;
 2 (function(win) {
 3     var doc = win.document;
 4     var docEl = doc.documentElement;
 5     var tid;
 6 
 7     function refreshRem() {
 8         var width = docEl.getBoundingClientRect().width;
 9         if (width > 540) { // 最大宽度
10             width = 540;
11         }
12         var rem = width / 6.4;
13         docEl.style.fontSize = rem + ‘px‘;
14     }
15 
16     win.addEventListener(‘resize‘, function() {
17         clearTimeout(tid);
18         tid = setTimeout(refreshRem, 300);
19     }, false);
20     win.addEventListener(‘pageshow‘, function(e) {
21         if (e.persisted) {
22             clearTimeout(tid);
23             tid = setTimeout(refreshRem, 300);
24         }
25     }, false);
26 
27     refreshRem();
28 
29 })(window);

设置680原稿下的字体为100px,这样是为了方便计算

rem适配代码

标签:res   var   设置   set   get   ted   nts   settime   dev   

原文地址:http://www.cnblogs.com/gulpone/p/7186233.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!