窗口调整大小后，fullpage.js仅会滚动溢出

Question

我在这里有一个fullpage.js网站设置。 第一部分没有scrollOverflow，但是第二部分是一个网格（使用gridify生成），需要（在某些屏幕尺寸上）它才能成为可滚动部分。

问题是它拒绝滚动。 但是，如果我调整窗口的大小（即使在任何方向上都按单个像素调整大小），则针对该部分将显示fullpage.js滚动条。

有谁知道为什么fullpage.js是这样工作的？ 以及如何使滚动条显示在该部分中而无需手动调整窗口大小？

值得一提的是，我已经使用scrolloverflow的fullpage.js示例页面获得了同样的效果。 那就是这里的设置。 但是，我无法弄清楚它为什么能在这里工作，但无法在我的原始页面中找到！

Answer 1

这可能是因为在初始化fullPage.js之后会生成（或以某种方式修改）您的部分或幻灯片的内容。

您应该在afterRender回调内使用该javascript代码作为fullPage.js文档详细信息 ：

afterRender（）

页面结构生成后立即触发此回调。 这是您要用来初始化其他插件或触发任何需要准备文档的代码的回调 （因为此插件修改DOM来创建结果结构）。

无论如何，我相信您可以通过调用reBuild提供的reBuild方法来解决。 您可以尝试在afterRender回调中使用它，或者直接在用于生成您要对其应用scrollOverflow选项的节的布局/内容的代码之后使用它。

$('#fullpage').fullpage({
    //your options
});

//code used to generate the content of your section 
//...

//re-building fullPage.js to detect the current content of each section
$.fn.fullpage.reBuild();

如果这不起作用，您可以随时尝试使用超时，这也应该延迟解决：

setTimeout(function(){
    $.fn.fullpage.reBuild();
}, 1000);