封面

window.innerWidth在500%放大倍率下精度不足问题

昨天干活的时候发现底边栏有一些白边,并没有填充满100%width,于是找了找问题


/static/01bd75fd87bcaec8452231d7851a22f72e97d2c9888499111d649fb231f8f259.png

在500%浏览器放大倍率下,会有一条非常非常窄的白边,排查发现是window.innerWidth只能返回整数,在高倍率下会存在小数点精度缺失问题

window.innerWidth

document.documentElement.clientWidth

这两个只返回整数,不返回小数点

window.visualViewport.width

document.documentElement.getBoundingClientRect().width

可以选择用这两个去获取宽度

!!!但是,我上网去搜了搜这个问题,发现并没有人提到,于是我又测了测

发现100%的时候不会出现小数点,所以正常情况下用哪个获取宽度都可以

[s-12][s-12]

神奇的小知识(虽然没什么用)

发布评论
全部评论(0)
最新
最早
加载中...