在滚动移动到下一部分

Question

我正在构建一个网站，当用户使用 html/css 和 js 在它们之间滚动时，我希望它自动移动到下一部分。

一个完美的例子是在特斯拉网站上： https://www.tesla.com/只要您滚动该部分一次，网站就会自动向下移动到下一个或上一个部分。

如果有人能告诉我如何实现这一点，我很难在网上找到相关文档，谢谢

Answer 1

我为您创建了一个设置，用于检查您是否需要滚动到下一部分或上一部分。

我希望您可以从此设置中创建 rest

 var lastScrollLocation = 0; $(window).scroll(function() { if ($(window).scrollTop() > lastScrollLocation) { lastScrollLocation = $(window).scrollTop(); console.log("next section"); } else { lastScrollLocation = $(window).scrollTop(); console.log("previous section"); } });

 .container section { height: 100vh; display: flex; }.container section p { margin: auto; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="container"> <section> <p> Section #1 </p> </section> <section> <p> Section #2 </p> </section> <section> <p> Section #3 </p> </section> <section> <p> Section #4 </p> </section> </div>