简单的 fullpage.js 滚动溢出问题答案

【问题标题】：Simple fullpage.js scrollOverflow issue简单的 fullpage.js 滚动溢出问题
【发布时间】：2018-01-19 10:13:00
【问题描述】：

fullpage.js 的scrollOverflow 插件在 jsfidde 或我的网站上不起作用。

简单的jsfiddle隔离复制。

使用 StackOverflow 的代码 sn-p 可以实现相同的代码。

$(document).ready(function() {
  $("#fullpage").fullpage({
    scrollOverflow: true
  });
});

<head>
  <link href="https://www.victorwesterlund.se/src/lib/fullpage.js/dist/jquery.fullPage.min.css" rel="stylesheet" />
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://www.victorwesterlund.se/src/lib/fullpage.js/vendors/scrolloverflow.min.js"></script>
  <script src="https://www.victorwesterlund.se/src/lib/fullpage.js/dist/jquery.fullPage.min.js"></script>
</head>

<body>
  <div id="fullpage">
    <div class="section">
      <h1>Lorem ipsum dolor sit amet, cotetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
      </h1>
    </div>
    <div class="section">
      <h1>Lorem ipsum dolor sit amet, cotetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
      </h1>
      <h1>Lorem ipsum dolor sit amet, cotetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
      </h1>
      <h1>Lorem ipsum dolor sit amet, cotetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
      </h1>
      <h1>Lorem ipsum dolor sit amet, cotetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna
      </h1>
    </div>
  </div>
</body>

【问题讨论】：

定义“不起作用”
@AndyHolmes 包含溢出视口的文本的部分不会滚动。就像我在 jsfidde 示例中展示的那样
我可以很好地滚动窗口，那么想要的输出是什么？
@AndyHolmes this 是所需的输出。它不会滚动带有溢出文本的最后一部分。在 Chrome、Firefox 和 Edge 上试过。所有最新版本
您的 jsFiddle 中有 2 个部分，当我打开该链接并滚动窗口时，该窗口上的输出与您刚刚发送给我的链接完全相同

标签： jquery fullpage.js

【解决方案1】：

确保：

使用latest scrolloverflow version (0.0.5)
使用the latest fullPage.js version 2.9.6
使用scrollOverflow: true

您的演示已更新： https://jsfiddle.net/yL9da6mz/3/

【讨论】：

谢谢 Alvaro，我通过使用 scrolloverflow 重新下载和重新实现 fullPage 解决了这个问题