在布局之前对窗口调整大小事件做出反应

Question

考虑一下https://developers.google.com/web/fundamentals/performance/rendering/上用漂亮的彩色图表描述的“像素管线”

我有一个元素（比如说一个跨度），我想在浏览器窗口调整大小时调整大小。 我正在使用window.onresize / window.addEventListener('resize'

这可行，我调整其大小以适合可用空间。 大。 但问题是，在我调整窗口大小后的一小段时间内（突然调整了大小，例如从全屏到30％的高度），显示了滚动条。 我相信它只是显示出来的，因为在运行我的onresize代码之前 ，管道对布局的更改进行了一次遍历布局，绘制和复合阶段，尽管在此周期中，除了窗口的更改外，其他都没有，但这足以使滚动条出现。 在下一个周期中，我减小了跨度的大小以适合窗口，并且滚动条消失了。

对于一个跨度的人为示例，我确定可以使用指定边距或类似内容的样式来解决问题，但是对于更一般的问题，我确实希望使用JavaScript进行调整。

谢谢。

Answer 1

我很确定您可以通过在paret容器上定义一个css来避免使用这些滚动条。这是一个猜测，但是我认为这是html或body

html, body {
    height: 100%;
    width: 100%;
    padding: 0px;
    margin: 0px;
    overflow: hidden;
}