窗口調整大小后，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);