关于在每个用户滚动上提供不同动画的反应解决方案的一般建议

Question

对于我已经尝试解决一段时间的问题，我找不到通用的解决方案。

我的网站需要包含 8 个部分，它们在浏览器中使用本机垂直滚动。

每个部分都有一个与之关联的时间轴，其中，上一节过渡到下一节。

第二个要求是每个时间线的长度可以不同例如：

1. 第 1 部分需要 10 秒才能过渡到第 2 部分
2. 第 2 部分需要 8 秒才能过渡到第 3 部分

主要的警告是用户只能滚动一次，即一次鼠标滚轮移动、一次按下或在滚动条上拖动一次，他们必须等到动画/时间线完成才能滚动再次。

任何人都可以提供解决方案或指向解决方案的指针吗？

我也在 React 工作。