fullpage 延迟滚动_使用fullPage.js进行垂直和水平滚动

要实现延迟滚动，可以使用fullPage.js提供的回调函数onLeave和afterLoad。在onLeave回调函数中可以设置定时器延迟滚动，而在afterLoad回调函数中可以清除定时器以取消延迟滚动。

以下是一个简单的实现示例：

<div id="fullpage">
  <div class="section">
    <h1>Section 1</h1>
  </div>
  <div class="section">
    <h1>Section 2</h1>
  </div>
  <div class="section">
    <h1>Section 3</h1>
  </div>
</div>

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/fullPage.js/3.1.2/fullpage.min.js"></script>
<script>
  $(document).ready(function() {
    $('#fullpage').fullpage({
      sectionsColor: ['#f2f2f2', '#4BBFC3', '#7BAABE'],
      onLeave: function(index, nextIndex, direction) {
        // 延迟200ms滚动
        setTimeout(function() {
          $.fn.fullpage.moveTo(nextIndex);
        }, 200);
        return false;
      },
      afterLoad: function(anchorLink, index) {
        // 清除定时器以取消延迟滚动
        clearTimeout();
      }
    });
  });
</script>

在此示例中，我们设置了延迟200ms滚动。您可以根据需要更改此值。