我如何使用 chrome 开发工具来查明页面上元素移动的原因?

How can I use chrome dev tools to pinpoint the cause of elements on my page shifting?

我页面顶部的某些内容导致内容布局发生重大变化。 内容呈现,然后像 300px 一样向上跳跃,然后向下跳回到它的正常位置。

我已尝试单步执行代码,但这似乎只有在您知道代码要在何处停止时才有用。

如何使用开发工具有效定位导致此问题的 javascript and/or 元素?

Here is the site

使用 Chrome 中的性能工具,您可以录制您的会话。 您可以将鼠标悬停在屏幕截图上,直到您看到页面发生变化。在这种情况下,就在跳跃发生时,您会看到一个“onLoad”事件

这可能表明某些 javascript 加载页面加载事件会改变您的样式?

单击匿名函数或任何这些事件将允许您在摘要中查看源代码中发生这种情况的位置。

然后你可以在发生这种情况的代码中设置一个断点。 (点击行左边的行号)

继续尝试直到找到问题所在