带滚动条更改的 Chrome 媒体查询

Chrome Media Query w/ Scrollbars Change

本文关键字:Chrome 媒体 查询 滚动条      更新时间:2023-09-26

Chrome 用于在其媒体查询中不正确地排除滚动条。这意味着在 1000px 的可见空间和 17px 的滚动条下,就媒体查询而言,其他浏览器会将 1017px 报告为宽度,但 webkit 浏览器(如 Chrome 和 Safari(没有这样做。

这些浏览器可能会达到特定大小,滚动条将以一种分辨率出现,然后将分辨率更改为另一种分辨率,然后它会回到它没有出现时......该解决方案导致滚动条应该出现一个丑陋的空白区域,但它没有。它看起来像一个小故障,并且 DOM 调整大小事件没有正确触发,因此您无法在 JS 中正确做出反应。

但是,现在在Chrome 29中,这种情况似乎已经改变。现在,他们正在摆脱规范的工作方式,并将滚动条包含在他们的媒体查询计算中......就像Firefox和Internet Explorer一样(以及规范中说它们应该一直如何(。这修复了错误,但会导致另一个问题,因为JS现在尝试检测Chrome/Safari问题会有误报,因为这不是较新版本的Chrome的问题,我认为最终Opera和Safari也是如此。

鉴于所有这些,我在Chrome或Webkit中找不到有关何时解决此问题的任何信息。我讨厌不得不在我的 JS 中求助于浏览器版本测试来解决这些缺陷,但我目前只是盲目猜测 Chrome 29+ 作为临时补丁,并希望得到权威的答案......我已经在 Safari 6.0.5 中进行了测试,但旧方法仍在使用......

有谁知道这是在哪个版本的Chrome和/或Webkit中修复的?

Chrome 从

Chrome v. 28 开始不再使用 webkit 引擎,它现在使用 Blink 渲染引擎。因此,除非您在以前的版本中需要它,否则无需为 chrome 检测此问题。

有关眨眼

的更多信息:眨眼文档

有关该版本的更多信息:下一篇关于Webkit/Blink Switch的网络文章