从锚点到锚点滚动多个 div答案

【问题标题】：Scroll through multiple divs from anchor to anchor从锚点到锚点滚动多个 div
【发布时间】：2019-07-27 11:47:08
【问题描述】：

我还有一个问题。最近我正在尝试构建一个包含三个 div 的页面。它们每个的高度为 100vh，宽度为 100vw。我要存档的是，如果我在 div 1 中滚动，它会自动平滑滚动到 div 2 的顶部。依此类推。希望你能理解我的问题。

div {
  width: 100vw;
  height: 100vh;
}

div:nth-child(odd) {
  background-color: green;
}

div:nth-child(even) {
  background-color: red;
}

<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>

【问题讨论】：

标签： javascript jquery html scroll

【解决方案1】：

您可以使用fullpage.js

new fullpage('#fullpage', {
  scrollOverflow:true
});

.section:nth-child(odd) {
  background-color: green;
}

.section:nth-child(even) {
  background-color: red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/3.0.7/fullpage.min.js" integrity="sha256-e13jRNqOX98m6UAwI/yZTpcDseJtA8s86yfFs4Sqrv8=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/3.0.7/vendors/scrolloverflow.min.js" integrity="sha256-R7CttZ4L0/szai0hbFUlPDiRaEJmqYuvLhyAOr19vQg=" crossorigin="anonymous"></script>

<div id="fullpage">
  <div class="section">Some section</div>
  <div class="section">Some section</div>
  <div class="section">Some section</div>
  <div class="section">Some section</div>
</div>

【讨论】：

谢谢！它奏效了，但我又陷入了困境。我包括了 fullpage.js。在 fullpage.js 中，我包含了 scrolloverflow.js。但是选项滚动溢出会导致此错误：“fullPage：选项scrollOverflow:true 需要文件scrolloverflow.min.js。请在fullPage.js 之前包含它。”有什么想法吗？
@Undelivered 我用 scrolloverflow 更新了演示