我从事网站工作已有多年，但仍未找到可靠地进行此操作的方法。当用户访问网站时，例如在使用fullpage.js之类的插件时，内容一直到处可见，直到CSS加载完毕，插件再按原样重新排序。例如，网站http://thisisdk.com使用整页，并且页面非常繁重，其中包含很多视频，但从一开始就无缝加载。我知道他们有一个加载程序，但是有什么告诉我，除了CDN等，还有很多其他非常聪明的东西。有兴趣听到其他开发人员的技巧和窍门，以了解他们如何在不使用预加载程序的情况下克服这一问题。
最佳答案
我总是建议人们在标头中使用load fullPage.js，这与流行的趋势相反，即在主体中添加JS文件。
为什么？
因为我认为fullPage.js对于正确可视化网站至关重要。没有fullpage.js，您的版块大小将不正确，正如您提到的那样，它们将重叠，幻灯片内容在不应该显示的情况下将可见...
其中一些操作需要fullpage.js运行，检测内容的尺寸，将幻灯片设置在正确的位置等。
您可以在fullPage.js提供的the demo pages中的任何一项中进行检查，并且不会出现此类闪烁。
如果您仍然不希望采用这种解决方案来加快网站的加载速度，那么我建议您使用关键的CSS技术来尽可能快地设置您的部分大小（即使在fullpage.js时也是如此）尚未初始化），并且没有任何HTTP请求（以加快处理速度）
在网站标题中使用以下内联样式：
<style>
html,body {
margin: 0;
padding: 0;
overflow:hidden;
}
.section,
.slide,
.fp-tableCell{
height: 100vh;
}
</style>
这将解决闪烁部分的问题。
一些可能的问题
如果您正在使用fullpage.js的条件初始化，那么即使您不需要它，它仍然会应用。
如果您动态销毁fullpage.js，则在不需要时仍会应用它。
内容大于视口的部分只有在加载并初始化插件后才具有滚动条。
即使您不希望使用某些幻灯片中的
setAllowScrolling(false)，也可以使用该幻灯片。关于javascript - 网页加载时的插件和html-元素遍地都是秒，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36034611/