我正在使用fullpage.js来设计像网站这样的整页轮播。我面临的问题是，当一个部分（see #section-1，部分从section-0开始）的内容延伸到视口之外时，实现响应式功能。
我想要什么？
最初，我想和scrollOverflow: true一起去，但这似乎不起作用。它中途莫名其妙地切断（隐藏）我的元素。我在其他帖子中读到作者不鼓励使用它。然后我使用respondsiveWidth，将其设置为980，因为如果窗口调整大小或以小于980px的宽度加载，我希望响应模式启动。滚动条可以正常工作，但截面的高度保持不变，即一个完整的视口。我想要的是这一部分扩展和容纳其全部内容。
我尝试了什么？
fp-auto-height和fp-auto-height-responsive添加到特定部分（#section-1），但这并没有做任何事情，（我还有一个包含该类的页脚，它的大小小于视口）
afterResize: function(){
if((window).width < 980) {
console.log("980");
$("#section-1").addClass("fp-auto-height-responsive");
}
}
我尝试使用CSS：
#section-1,
#section-1 .fp-slide,
#section-1 .fp-tableCell{
height: auto !important;
min-height: 100%;
}
我还在CSS中声明了一个单独的类，添加了上述属性，并在我的javascript文件中addClass window.width is < 980。
我所做的一切似乎都没有用，而且我处于神经衰弱的边缘。
帮助将不胜感激。
答案 0 :(得分：1)
我想要的是，这部分是为了扩展和容纳它的 全部内容。
那是fp-auto-height-responsive的用途。
您可能没有正确使用它。您不必须动态添加它，但只需添加您不希望fullPage.js限制尺寸的部分。
<div class="section fp-auto-height-responsive" id="section-1">
Your demo正在为我工作。当响应被触发时，蓝色部分不会获得视口大小，并且文本不会被删除。
如果你要求第2部分，这是完全正常的。您正在使用fixed元素。与使用absolute相同。在这些情况下，没有fullPage.js可以为您做什么。 fullPage.js只限制限制该部分的尺寸，这意味着它将采取其他任何尺寸。在您的情况下，任何固定或绝对定位的元素都不会强制其父高度发生变化。