请稍等 ...
×

采纳答案成功!

向帮助你的同学说点啥吧!感谢那些助人为乐的人

js实现rem响应式

/计算屏幕基准font-size比例/
(function(doc, win) {
var docEl = doc.documentElement,
dpr = win.devicePixelRatio;
resizeEvt = ‘orientationchange’ in window ? ‘orientationchange’ : ‘resize’;
docEl.dataset.dpr = dpr;
var recalc = function() {
var width = docEl.clientWidth;
if (width / dpr > 750) {
width = 750 * dpr;
}
docEl.style.fontSize = 100 * (width / 750) + ‘px’;
};
recalc();
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
})(document, window);

通过js计算来实现rem的响应式 还会有什么弊端吗

正在回答 回答被采纳积分+3

1回答

双越 2020-06-23 23:31:39

弊端就是需要 js 计算,而且 js 计算和 DOM 渲染还是互斥的。如果网速稍微慢一点(加载 js 慢),或者浏览器稍微卡顿一点(执行 js 速度慢),那页面可能会出现卡顿或者大小的变化。

而用 css ,那就没有 js 计算的过程,来了什么样,渲染出来就是什么样。

0 回复 有任何疑惑可以回复我~
  • 提问者 csupwj #1
    那大厂用哪种方案呀
    回复 有任何疑惑可以回复我~ 2020-06-29 16:51:13
  • 双越 回复 提问者 csupwj #2
    rem 和 vw-vh 都会用。
    回复 有任何疑惑可以回复我~ 2020-06-29 21:10:08
  • 慕粉3871079 回复 双越 #3
    vw vh 计算还是挺麻烦的,感觉也只能用于比较大的布局中
    回复 有任何疑惑可以回复我~ 2021-03-04 15:59:44
问题已解决,确定采纳
还有疑问,暂不采纳
意见反馈 帮助中心 APP下载
官方微信