Question

我正在根据最新的fullpage.js版本（开发者许可）构建一个包含多个部分的复杂页面。我有3个具有自动滚动功能的全高部分，然后还有3个子部分。在代码中，它基本上是这样的：

<div id="fullpage">
   <div class="section">content</div>
   <div class="section">content</div>
   <div class="section">content</div>
   ...
   <div class="section sub-section">content</div>
   <div class="section sub-section">content</div>
   <div class="section sub-section">content</div>
</div>

我希望这些小节具有正常的滚动，这可能吗？

Answer 1

fullPage.js还没有提供任何内容。您最多可以做的是将所有这些最后的部分都包含在网站的最后一个部分中，然后使用scrollOverflow:true来模仿this example中的正常滚动行为。

查看此demo online

<div id="fullpage">
   <div class="section">content</div>
   <div class="section">content</div>
   <div class="section">content</div>
   <div class="section">
       <div class="sub-section">sub content</div>
       <div class="sub-section">sub content</div>
       <div class="sub-section">sub content</div>
    </div>
</div>

使用类似这样的内容：

sub-section{
  height: 100vh;
  width: 100%;
}
.sub-section{
  background: red;
}
.sub-section:nth-child(1){
  background: red;
}
.sub-section:nth-child(2){
  background: blue;
}

fullpage.js：正常滚动特定部分？

1 个答案: