转到下一部分向下滚动,上一节向上滚动



我正在为电影制作人创建一个作品集网站。我想要的如下:当用户向下滚动窗口时,页面将转到下一部分,向上滚动时,页面将转到上一部分。它们看起来像跳转到另一个页面,但它们应该在单个页面中。示例如下:网站(http://taotajima.jp/、http://maxxhat.com/(。

我可以通过单击事件做到这一点,但我不知道如何使用 SCROLL 做到这一点。

我想要的不是这样的东西(https://alvarotrigo.com/fullPage/#page1(。

我的代码是这样的:

<body>
  <section id="first" class="current">
      Content
  </section>
  <section id="second">
      Content
  </section>
  <section id="third">
      Content
  </section>
  <section id="fourth">
      Content
  </section>
</body>

每个部分都是整页视图。具有"当前"的部分显示在页面中。我想从当前部分中删除"当前"类,并在向下滚动时将其附加到下一部分,向上滚动上一节。我该怎么做?

提前谢谢你。

你可以像这样用jQuery来做,

定义您的目标div。

var yourDiv = $('#divID').offset();

然后使用如下方式滚动到上面定义的任何div,如下所示,

$('html, body').animate({scrollTop: yourDiv.top}, "slow");

注意 - 如果可以的话,有一些jQuery插件可以非常容易地实现这一点。 一个是jQuery ScrollTo。 您可以通过简单地谷歌搜索它们来找到许多其他人

最新更新